Add a test of keyframe_interval (ki) parameter

Author: YomesInc

src/cloudinary-video.component.spec.ts

@@ -73,17 +73,30 @@ describe('CloudinaryVideo', () => {
 
   describe('videos with nested transformations', () => {
     @Component({
-      template: `<cl-video id="video1" public-id="sample_video">
-            <cl-transformation width="300" crop="scale" overlay="text:roboto_35_bold:SDK"></cl-transformation>
-            <cl-transformation effect="art:hokusai"></cl-transformation>
-            <cl-transformation fetch_format="auto"></cl-transformation>
-            </cl-video>`
+      template: `
+        <cl-video id="video1" public-id="sample_video">
+          <cl-transformation width="300" crop="scale" keyframe_interval="10" overlay="text:roboto_35_bold:SDK"></cl-transformation>
+          <cl-transformation effect="art:hokusai"></cl-transformation>
+          <cl-transformation fetch_format="auto"></cl-transformation>
+        </cl-video>
+        <cl-video id="video2" public-id="sample_video">
+          <cl-transformation width="300" crop="scale" keyframe-interval="0.05" overlay="text:roboto_35_bold:SDK"></cl-transformation>
+          <cl-transformation effect="art:hokusai"></cl-transformation>
+          <cl-transformation fetch_format="auto"></cl-transformation>
+        </cl-video>
+        <cl-video id="video3" public-id="sample_video">
+          <cl-transformation keyframe_interval="3.45"></cl-transformation>
+        </cl-video>
+        <cl-video id="video4" public-id="sample_video">
+          <cl-transformation keyframe_interval="300"></cl-transformation>
+        </cl-video>
+      `
     })
     class TestComponent {
     }
 
     let fixture: ComponentFixture<TestComponent>;
-    let des: DebugElement;  // the elements w/ the directive
+    let des: DebugElement[];  // the elements w/ the directive
 
     beforeEach(() => {
       fixture = TestBed.configureTestingModule({
@@ -94,25 +107,33 @@ describe('CloudinaryVideo', () => {
       fixture.detectChanges(); // initial binding
 
       // all elements with an attached CloudinaryVideo
-      des = fixture.debugElement.query(By.directive(CloudinaryVideo));
+      des = fixture.debugElement.queryAll(By.directive(CloudinaryVideo));
     });
 
     it('creates a <video> element which encodes the directive attributes to the URL', () => {
-      const video = des.children[0].nativeElement as HTMLVideoElement;
-      // Created <video> element should have 3 child <source> elements for mp4, webm, ogg
-      expect(video.childElementCount).toBe(3);
+      des.forEach((element, index) => {
+        const matchers = [
+          /c_scale,ki_10,l_text:roboto_35_bold:SDK,w_300\/e_art:hokusai\/f_auto\/sample_video/,
+          /c_scale,ki_0\.05,l_text:roboto_35_bold:SDK,w_300\/e_art:hokusai\/f_auto\/sample_video/,
+          /ki_3\.45\/sample_video/,
+          /ki_300\/sample_video/,
+
+        ];
+        const video = element.children[0].nativeElement as HTMLVideoElement;
+        // Created <video> element should have 3 child <source> elements for mp4, webm, ogg
+        expect(video.childElementCount).toBe(3);
 
-      for (let i = 0; i < 3; i++) {
-        expect(video.children[i].attributes.getNamedItem('src')).toBeDefined();
-        expect(video.children[i].attributes.getNamedItem('src').value).toEqual(
-          jasmine.stringMatching
-            (/c_scale,l_text:roboto_35_bold:SDK,w_300\/e_art:hokusai\/f_auto\/sample_video/));
-        expect(video.children[i].attributes.getNamedItem('src').value).toEqual(
-          jasmine.stringMatching(/video\/upload/));
-      }
+        for (let i = 0; i < 3; i++) {
+          expect(video.children[i].attributes.getNamedItem('src')).toBeDefined();
+          expect(video.children[i].attributes.getNamedItem('src').value).toEqual(
+            jasmine.stringMatching(matchers[index]));
+          expect(video.children[i].attributes.getNamedItem('src').value).toEqual(
+            jasmine.stringMatching(/video\/upload/));
+        }
+      });
 
       // verify interaction with underlying cloudinary-core lib
-      expect(localCloudinary.videoTag).toHaveBeenCalledTimes(1);
+      expect(localCloudinary.videoTag).toHaveBeenCalledTimes(4);
     });
   });