Support saving assignments where the URL has been picked using the Yo…

…uTubePicker (#5485)
hypothesis · Jun 15, 2023 · 5e8784d · 5e8784d
1 parent c756a94
commit 5e8784d
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 6 deletions.
diff --git a/lms/static/scripts/frontend_apps/components/ContentSelector.tsx b/lms/static/scripts/frontend_apps/components/ContentSelector.tsx
@@ -249,7 +249,9 @@ export default function ContentSelector({
       );
       break;
     case 'youtube':
-      dialog = <YouTubePicker onCancel={cancelDialog} onSelectURL={() => {}} />;
+      dialog = (
+        <YouTubePicker onCancel={cancelDialog} onSelectURL={selectURL} />
+      );
       break;
     default:
       dialog = null;

diff --git a/lms/static/scripts/frontend_apps/components/YouTubePicker.tsx b/lms/static/scripts/frontend_apps/components/YouTubePicker.tsx
@@ -86,8 +86,8 @@ export default function YouTubePicker({
   const onURLChange = (inputURL: string) => setCurrentURL(inputURL);
   const resetCurrentURL = () => setCurrentURL(undefined);
   const confirmSelection = () => {
-    if (videoId) {
-      onSelectURL(`youtube://${videoId}`);
+    if (currentURL) {
+      onSelectURL(currentURL);
     }
   };
 

diff --git a/lms/static/scripts/frontend_apps/components/test/ContentSelector-test.js b/lms/static/scripts/frontend_apps/components/test/ContentSelector-test.js
@@ -637,14 +637,16 @@ describe('ContentSelector', () => {
   });
 
   describe('YouTube picker', () => {
-    it('renders YouTube picker button if enabled', () => {
+    beforeEach(() => {
       fakeConfig.filePicker.youtube.enabled = true;
+    });
+
+    it('renders YouTube picker button if enabled', () => {
       const wrapper = renderContentSelector();
       assert.isTrue(wrapper.exists('Button[data-testid="youtube-button"]'));
     });
 
     it('shows YouTube picker when YouTube button is clicked', () => {
-      fakeConfig.filePicker.youtube.enabled = true;
       const onSelectContent = sinon.stub();
       const wrapper = renderContentSelector({ onSelectContent });
 
@@ -655,5 +657,23 @@ describe('ContentSelector', () => {
 
       assert.isTrue(wrapper.exists('YouTubePicker'));
     });
+
+    it('supports selecting a URL', () => {
+      const onSelectContent = sinon.stub();
+      const wrapper = renderContentSelector({
+        defaultActiveDialog: 'youtube',
+        onSelectContent,
+      });
+
+      const picker = wrapper.find('YouTubePicker');
+      interact(wrapper, () => {
+        picker.props().onSelectURL('https://youtu.be/EU6TDnV5osM');
+      });
+
+      assert.calledWith(onSelectContent, {
+        type: 'url',
+        url: 'https://youtu.be/EU6TDnV5osM',
+      });
+    });
   });
 });
diff --git a/lms/static/scripts/frontend_apps/components/test/YouTubePicker-test.js b/lms/static/scripts/frontend_apps/components/test/YouTubePicker-test.js
@@ -52,7 +52,7 @@ describe('YouTubePicker', () => {
     const wrapper = renderComponent();
 
     wrapper.find('button[data-testid="select-button"]').props().onClick();
-    assert.calledWith(fakeOnSelectURL, 'youtube://videoId');
+    assert.calledWith(fakeOnSelectURL, 'https://youtu.be/videoId');
   });
 
   [undefined, 'not-a-youtube-url'].forEach(defaultURL => {