feat(video-annotations): add default video location support (#733)

* feat(video-annotations): add default video location support

* feat(video-annotations): add default video location support

* feat(video-annotations): adding invalid location protection

* feat(video-annotations): adding more tests

* feat(video-annotations): adding more tests

* feat(video-annotations): fixing TS issues

* feat(video-annotations): addressing PR comments

Author: bfoxx1906

src/media/MediaAnnotator.ts

@@ -120,18 +120,19 @@ export default class MediaAnnotator extends BaseAnnotator {
     // the other annotators as the client calls this function when it wants to show an annoation on the
     // preview. The only difference is that we are using the video element's currentTime to scroll to the 
     // annotation instead of the scrollLeft and scrollTop of the parent element.
-    scrollToAnnotation(annotationId: string | null): void {
+    scrollToAnnotation(annotationId: string | null | undefined, defaultLocation: number = -1 ): void {
+        
         if (!annotationId) {
             return;
         }
-
         const annotation = getAnnotation(this.store.getState(), annotationId);
-        const annotationLocation = annotation?.target.location.value ?? 0
+        const annotationLocation = annotation?.target?.location?.value ?? defaultLocation;
         const video = this.getReference();
-        if (!annotation || !video || !this.annotatedEl) {
+
+        if ( !video || !this.annotatedEl || annotationLocation === -1 ) {
             return;
         }
-  
+
         video.pause();
         video.currentTime = annotationLocation / 1000;
 

src/media/__tests__/MediaAnnotator-test.ts

@@ -268,30 +268,75 @@ describe('MediaAnnotator', () => {
             jest.restoreAllMocks();
         });
 
-        test('should call scrollToLocation for region annotations', () => {
-            annotator.scrollToAnnotation('video_region_anno_1');
+        test.each([
+            { type: 'region', ids: ['video_region_anno_1', 'video_region_anno_2', 'video_region_anno_3'] },
+            { type: 'drawing', ids: ['video_drawing_anno_1', 'video_drawing_anno_2', 'video_drawing_anno_3'] },
+        ])('should call scrollToLocation for $type annotations', ({ ids }) => {
+            annotator.scrollToAnnotation(ids[0]);
             expect(mockVideo.currentTime).toBe(10);
-            annotator.scrollToAnnotation('video_region_anno_2');
+            annotator.scrollToAnnotation(ids[1]);
             expect(mockVideo.currentTime).toBe(20);
-            annotator.scrollToAnnotation('video_region_anno_3');
+            annotator.scrollToAnnotation(ids[2]);
             expect(mockVideo.currentTime).toBe(30);
             expect(mockVideo.pause).toHaveBeenCalledTimes(3);
         });
 
-        test('should call scrollToLocation for drawing anntotations', () => {
-            annotator.scrollToAnnotation('video_drawing_anno_1');
+
+
+        test('should do nothing if the annotation id is undefined or null' ,() => {
+            annotator.scrollToAnnotation(undefined);
+            expect(mockVideo.currentTime).toBe(0);
+            expect(mockVideo.pause).not.toHaveBeenCalled();
+            annotator.scrollToAnnotation(null);
+            expect(mockVideo.currentTime).toBe(0);
+            expect(mockVideo.pause).not.toHaveBeenCalled();
+        });
+
+        test('should do nothing if the annotation is not available in the store and default location is not provided', () => {
+            annotator.scrollToAnnotation('id_not_in_store');
+            expect(mockVideo.currentTime).toBe(0);
+            expect(mockVideo.pause).not.toHaveBeenCalled();
+        });
+
+        test('should set correct video time if default location is provided but annotation is available in the store', () => {
+            annotator.scrollToAnnotation('video_region_anno_1', 2100);
             expect(mockVideo.currentTime).toBe(10);
-            annotator.scrollToAnnotation('video_drawing_anno_2');
+            expect(mockVideo.pause).toHaveBeenCalled();
+        });
+
+        test('should handle undefined and null default location', () => {
+    
+            annotator.scrollToAnnotation('video_region_anno_1', undefined);
+            expect(mockVideo.currentTime).toBe(10);
+            expect(mockVideo.pause).toHaveBeenCalled();
+         
+            annotator.scrollToAnnotation('video_region_anno_2', null as unknown as number);
             expect(mockVideo.currentTime).toBe(20);
-            annotator.scrollToAnnotation('video_drawing_anno_3');
+            expect(mockVideo.pause).toHaveBeenCalledTimes(2);
+        });
+
+        test('should set correct video time if default location is provided and annotation is not available in the store', () => {
+            annotator.scrollToAnnotation('id_not_in_store', 30000);
             expect(mockVideo.currentTime).toBe(30);
-            expect(mockVideo.pause).toHaveBeenCalledTimes(3);
+            expect(mockVideo.pause).toHaveBeenCalled();
         });
 
-        test('should do nothing if the annotation id is undefined or not available in the store', () => {
-            annotator.scrollToAnnotation('video_drawing_anno_12');
+        test('should do nothing if the video element is not defined', () => {
+            annotator.getReference = jest.fn().mockReturnValue(null);
+            annotator.scrollToAnnotation('video_region_anno_1');
             expect(mockVideo.currentTime).toBe(0);
-            annotator.scrollToAnnotation(null);
+            expect(mockVideo.pause).not.toHaveBeenCalled();
+        });
+
+        test('should do nothing if the annotated element is not defined', () => {
+            annotator.annotatedEl = undefined;
+            annotator.scrollToAnnotation('video_region_anno_1');
+            expect(mockVideo.currentTime).toBe(0);
+            expect(mockVideo.pause).not.toHaveBeenCalled();
+        });
+
+        test('should do nothing if the annotation target location is invalid', () => {
+            annotator.scrollToAnnotation('annotation_with_invalid_target');
             expect(mockVideo.currentTime).toBe(0);
             expect(mockVideo.pause).not.toHaveBeenCalled();
         });

src/region/__mocks__/data.ts

@@ -99,4 +99,13 @@ export const videoAnnotations = [
             type: 'region',
         },
     },
+
+    {
+        id: 'annotation_with_invalid_target',
+        target: {
+            location: { type: TARGET_TYPE.FRAME },
+            shape: { height: 30, width: 30, x: 30, y: 30, type: 'rect' },
+            type: 'region',
+        },
+    },
 ];