branch

Author: stephenliang

frontend/packages/component-library/src/video/stories/Video.story.tsx

@@ -107,3 +107,28 @@ export const VideoWithCaptionAndFallback: Story = {
     expect(download).toBeVisible();
   },
 };
+export const VideoWithCaptionAndFallbackT: Story = {
+  args: {
+    videoTitle: "What Most Schools Don't Teach",
+    videoFallback:
+        'https://videos.code.org/social/what-most-schools-dont-teach.mp4',
+    youTubeId: 'nKIu9yen5nc',
+    showCaption: true,
+  },
+  play: async ({canvasElement}) => {
+    const canvas = within(canvasElement);
+    await new Promise(resolve => setTimeout(resolve, 1000));
+    const video = await canvas.findByTitle("What Most Schools Don't Teach");
+    const caption = canvas.getByText("What Most Schools Don't Teach");
+    const download = canvas.getByRole('link');
+
+    // check if video is visible
+    expect(video).toBeVisible();
+
+    // check if caption is visible
+    expect(caption).toBeVisible();
+
+    // check if download button is visible
+    expect(download).toBeVisible();
+  },
+};