Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

UI Crash on hovering over annotation conflicts which don't have UI representation #7775

Open
2 tasks done
Viditagarwal7479 opened this issue Apr 15, 2024 · 3 comments · May be fixed by #7776
Open
2 tasks done

UI Crash on hovering over annotation conflicts which don't have UI representation #7775

Viditagarwal7479 opened this issue Apr 15, 2024 · 3 comments · May be fixed by #7776
Labels
bug Something isn't working

Comments

@Viditagarwal7479
Copy link
Contributor

Viditagarwal7479 commented Apr 15, 2024 •
edited

Actions before raising this issue

  • I searched the existing issues and did not find anything similar.
  • I read/searched the docs

Steps to Reproduce

  1. Create a task from this backup task.zip
  2. Go into the review section of the job
  3. See the conflicts with the GT job
  4. While hovering over the conflicts, suddenly, the UI crashes with the following error message

Expected Behavior

The conflicting annotation is to be highlighted if available

Possible Solution

I guess that this issue occurred when I tried to highlight conflicts which can't be displayed on UI like the mismatching groups. So we can just filter not to highlight such conflicts. https://github.com/cvat-ai/cvat/blob/develop/cvat-ui/src/components/annotation-page/canvas/views/canvas2d/canvas-wrapper.tsx#L483

Context

Error Message

TypeError
drawnState is undefined

deactivateShape@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:143205:11
deactivate@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:143249:10
highlight@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:143526:12
notify@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:142585:12
notify@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:147898:16
highlight@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:140847:10
highlight@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:140283:16
componentDidUpdate@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:179756:22
commitLifeCycles@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:442761:22
commitLayoutEffects@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:445729:23
callCallback@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:423114:14
invokeGuardedCallbackDev@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:423163:16
invokeGuardedCallback@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:423218:31
commitRootImpl@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:445467:30
unstable_runWithPriority@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:466190:12
runWithPriority$1@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:433965:10
commitRoot@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:445307:20
finishSyncRender@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:444733:13
performSyncWorkOnRoot@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:444719:23
../node_modules/react-dom/cjs/react-dom.development.js/flushSyncCallbackQueueImpl/<@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:434015:24
unstable_runWithPriority@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:466190:12
runWithPriority$1@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:433965:10
flushSyncCallbackQueueImpl@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:434010:24
flushSyncCallbackQueue@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:433998:3
batchedEventUpdates$1@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:444803:7
batchedEventUpdates@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:423721:12
dispatchEventForLegacyPluginEventSystem@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:426494:24
attemptToDispatchEvent@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:427193:44
dispatchEvent@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:427115:41
unstable_runWithPriority@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:466190:12
dispatchUserBlockingUpdate@http://localhost:3000/assets/cvat-ui.54562adfd37f714d4369.min.js:427098:18

The following was logged in the browser console,

Uncaught TypeError: drawnState is undefined
    deactivateShape canvasView.ts:2250
    deactivate canvasView.ts:2304
    highlight canvasView.ts:2614
    notify canvasView.ts:1557
    notify master.ts:27
    highlight canvasModel.ts:651
    highlight canvas.ts:113
    componentDidUpdate canvas-wrapper.tsx:492
    React 6
    unstable_runWithPriority scheduler.development.js:653
    React 5
    unstable_runWithPriority scheduler.development.js:653
    React 8
    unstable_runWithPriority scheduler.development.js:653
    dispatchUserBlockingUpdate React
canvasView.ts:2250:16
The above error occurred in the <CanvasWrapperComponent> component:
    in CanvasWrapperComponent (created by Connect(CanvasWrapperComponent))
    in Connect(CanvasWrapperComponent) (created by CanvasLayout)
    in div (created by GridItem)
    in Resizable (created by GridItem)
    in DraggableCore (created by GridItem)
    in GridItem (created by ReactGridLayout)
    in div (created by ReactGridLayout)
    in ReactGridLayout (created by WidthProvider)
    in WidthProvider (created by CanvasLayout)
    in main (created by Basic)
    in Basic (created by Content)
    in Content (created by CanvasLayout)
    in CanvasLayout
    in CanvasLayout (created by ReviewWorkspaceComponent)
    in section (created by BasicLayout)
    in BasicLayout (created by Layout)
    in Layout (created by ReviewWorkspaceComponent)
    in ReviewWorkspaceComponent (created by AnnotationPageComponent)
    in main (created by Basic)
    in Basic (created by Content)
    in Content (created by AnnotationPageComponent)
    in section (created by BasicLayout)
    in BasicLayout (created by Layout)
    in Layout (created by AnnotationPageComponent)
    in AnnotationPageComponent (created by Connect(AnnotationPageComponent))
    in Connect(AnnotationPageComponent) (created by Context.Consumer)
    in withRouter(Connect(AnnotationPageComponent)) (created by Context.Consumer)
    in Route (created by CVATApplication)
    in Switch (created by CVATApplication)
    in main (created by Basic)
    in Basic (created by Content)
    in Content (created by CVATApplication)
    in section (created by BasicLayout)
    in BasicLayout (created by Layout)
    in Layout (created by CVATApplication)
    in ShortcutsProvider (created by CVATApplication)
    in GlobalErrorBoundary (created by Connect(GlobalErrorBoundary))
    in Connect(GlobalErrorBoundary) (created by CVATApplication)
    in CVATApplication (created by Context.Consumer)
    in withRouter(CVATApplication) (created by Connect(withRouter(CVATApplication)))
    in Connect(withRouter(CVATApplication))
    in Router (created by BrowserRouter)
    in BrowserRouter
    in Provider

React will try to recreate this component tree from scratch using the error boundary you provided, GlobalErrorBoundary. react-dom.development.js:19527
@Viditagarwal7479 Viditagarwal7479 added the bug Something isn't working label Apr 15, 2024
@Viditagarwal7479
Copy link
Contributor Author

On trying on multiple types of conflicts, I guess this behaviour only occurs for the mismatching groups type of conflict I have attached a screenshot of the console log detail of the action which led to this crash.
image

@Viditagarwal7479
Copy link
Contributor Author

A similar UI crash was observed when the shape attribute was missing, like the drawnState attribute, as mentioned above.

This was referenced Apr 15, 2024
Open
Merged
@klakhov
Copy link
Contributor

klakhov commented May 20, 2024

While trying out the issue's scenario Ive noticed that conflicts are not shown properly on the 0 frame. If I change the the frame and go back, the conflicts are rendered properly and no crush occurs. I belive we need to adress the problem with why are those conflicts are not rendered.
Consider:
gt-problem

@klakhov klakhov mentioned this issue May 20, 2024
Merged
7 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
2 participants
@klakhov @Viditagarwal7479