fix(VideoPlayer): fix for mocking VideoPlayerAPI in storyshots (#2692)

The CI checks were running with obfuscated Kaltura IDs since they are
passed in as environment variables, so this is setting up a mock for
the VideoPlayerAPI service to return back mocked data instead.

Author: jeffchew

packages/react/config/jest/__mocks__/LocaleAPI.js

@@ -0,0 +1,13 @@
+/**
+ * Copyright IBM Corp. 2020
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import mocklist from '../../../src/components/Footer/__data__/locale-list';
+
+module.exports = {
+  getLocale: jest.fn(() => Promise.resolve({ cc: 'us', lc: 'en' })),
+  getList: jest.fn(() => Promise.resolve(mocklist)),
+};

packages/react/config/jest/__mocks__/VideoPlayerAPI.js

@@ -0,0 +1,20 @@
+/**
+ * Copyright IBM Corp. 2020
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import apiResponse from '../../../../services/src/services/VideoPlayer/__tests__/data/response.json';
+
+module.exports = {
+  getThumbnailUrl: jest.fn(() => {
+    return 'https://cdnsecakmi.kaltura.com/p/123456/thumbnail/entry_id/0_uka1msg4/width/320';
+  }),
+  api: jest.fn(() => Promise.resolve(apiResponse)),
+  getVideoDuration: jest.fn(() => {
+    return '(1:00)';
+  }),
+  fireEvent: jest.fn(() => {}),
+  embedVideo: jest.fn(() => Promise.resolve()),
+};

packages/react/config/jest/setup.js

@@ -22,6 +22,12 @@ global.window.location = {
   href: 'http://localhost',
 };
 
+jest.mock('@carbon/ibmdotcom-services', () => ({
+  LocaleAPI: require('./__mocks__/LocaleAPI'),
+  VideoPlayerAPI: require('./__mocks__/VideoPlayerAPI'),
+  globalInit: jest.fn(() => {}),
+}));
+
 const enzyme = require.requireActual('enzyme');
 const Adapter = require.requireActual('enzyme-adapter-react-16');
 

packages/react/src/__tests__/__snapshots__/storyshots.test.js.snap

@@ -5082,7 +5082,7 @@ exports[`Storyshots Components|LightboxMediaViewer Embedded Video Player 1`] = `
                               videoId="0_uka1msg4"
                             >
                               <div
-                                aria-label="undefined undefined"
+                                aria-label=" (1:00)"
                                 className="bx--video-player"
                               >
                                 <div
@@ -12199,7 +12199,7 @@ exports[`Storyshots Components|VideoPlayer Default 1`] = `
             videoId="0_uka1msg4"
           >
             <div
-              aria-label="undefined undefined"
+              aria-label=" (1:00)"
               className="bx--video-player"
             >
               <div
@@ -12215,6 +12215,7 @@ exports[`Storyshots Components|VideoPlayer Default 1`] = `
                 className="bx--video-player__video-caption"
               >
 
+                (1:00)
               </div>
             </div>
           </VideoPlayer>

packages/react/src/components/VideoPlayer/VideoPlayer.js

@@ -19,7 +19,7 @@ const { prefix } = settings;
  * VideoPlayer component.
  */
 const VideoPlayer = ({ inverse, showCaption, videoId, customClassName }) => {
-  const [videoData, setVideoData] = useState({ description: '' });
+  const [videoData, setVideoData] = useState({ description: '', name: '' });
   const videoPlayerId = `video-player__video-${videoId}`;
   const videoDuration = VideoPlayerAPI.getVideoDuration(videoData.msDuration);
 
@@ -56,7 +56,8 @@ const VideoPlayer = ({ inverse, showCaption, videoId, customClassName }) => {
         data-autoid={`${stablePrefix}--${videoPlayerId}`}>
         <div
           className={`${prefix}--video-player__video`}
-          id={`${prefix}--${videoPlayerId}`}></div>
+          id={`${prefix}--${videoPlayerId}`}
+        />
       </div>
       {showCaption && (
         <div className={`${prefix}--video-player__video-caption`}>

packages/utilities/src/utilities/smoothScroll/smoothScroll.js

@@ -27,7 +27,6 @@ const smoothScroll = (e, selector, offset = 0) => {
   if (e !== null) {
     e.preventDefault();
     getSelector = e.currentTarget.getAttribute('href');
-    console.log('getSelector', getSelector);
   } else if (selector) {
     getSelector = selector;
   } else {