Merge pull request #2684 from bbc/scrollbar-av-player-fix

AV: iFrame scrollbar media player fix
BBC-archive · Nov 26, 2019 · ca71d2a · ca71d2a
2 parents 7114b81 + 9914207
commit ca71d2a
Show file tree

Hide file tree

Showing 8 changed files with 12 additions and 2 deletions.
diff --git a/packages/components/psammead-media-player/CHANGELOG.md b/packages/components/psammead-media-player/CHANGELOG.md
@@ -3,6 +3,7 @@
 <!-- prettier-ignore -->
 | Version       | Description                                                                                                                  |
 | ------------- | ---------------------------------------------------------------------------------------------------------------------------- |
+| 2.3.3 | [PR#2684](https://github.com/bbc/psammead/pull/2684) Added scrolling attribute to disable scrolling on canonical and amp iframe |
 | 2.3.2 | [PR#2666](https://github.com/bbc/psammead/pull/2666) Talos - Bump Dependencies - @bbc/psammead-play-button |
 | 2.3.1 | [PR#2663](https://github.com/bbc/psammead/pull/2663) Talos - Bump Dependencies - @bbc/psammead-assets |
 | 2.3.0 | [PR#2628](https://github.com/bbc/psammead/pull/2628) Add guidance message for assistive technology in Play Button and hide it in Guidance |

diff --git a/packages/components/psammead-media-player/package-lock.json b/packages/components/psammead-media-player/package-lock.json
diff --git a/packages/components/psammead-media-player/package.json b/packages/components/psammead-media-player/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@bbc/psammead-media-player",
-  "version": "2.3.2",
+  "version": "2.3.3",
   "description": "Provides a media player with optional placeholder",
   "main": "dist/index.js",
   "module": "esm/index.js",

diff --git a/packages/components/psammead-media-player/src/Amp/__snapshots__/index.test.jsx.snap b/packages/components/psammead-media-player/src/Amp/__snapshots__/index.test.jsx.snap
@@ -16,6 +16,7 @@ exports[`Media Player: Amp should render an amp-iframe with an amp-img nested in
         frameborder="0"
         layout="fill"
         sandbox="allow-scripts allow-same-origin"
+        scrolling="no"
         src="https://foo.bar/iframe"
         title="Media player"
       >

diff --git a/packages/components/psammead-media-player/src/Amp/index.jsx b/packages/components/psammead-media-player/src/Amp/index.jsx
@@ -27,6 +27,7 @@ const AmpMediaPlayer = ({
       <amp-iframe
         sandbox="allow-scripts allow-same-origin"
         layout="fill"
+        scrolling="no"
         frameborder="0"
         src={src}
         title={title}

diff --git a/packages/components/psammead-media-player/src/Canonical/__snapshots__/index.test.jsx.snap b/packages/components/psammead-media-player/src/Canonical/__snapshots__/index.test.jsx.snap
@@ -15,6 +15,7 @@ exports[`Media Player: Canonical should render an iframe 1`] = `
   allow="autoplay; fullscreen"
   allowfullscreen=""
   class="c0"
+  scrolling="no"
   src="https://foo.bar/iframe"
   title="Media player"
 />

diff --git a/packages/components/psammead-media-player/src/Canonical/index.jsx b/packages/components/psammead-media-player/src/Canonical/index.jsx
@@ -25,6 +25,7 @@ const Canonical = ({ src, title, placeholderSrc }) => {
       src={src}
       title={title}
       allow="autoplay; fullscreen"
+      scrolling="no"
       gesture="media"
       allowFullScreen
     />

diff --git a/packages/components/psammead-media-player/src/__snapshots__/index.test.jsx.snap b/packages/components/psammead-media-player/src/__snapshots__/index.test.jsx.snap
@@ -25,6 +25,7 @@ exports[`Media Player: AMP Entry renders a landscape container with an amp-ifram
           frameborder="0"
           layout="fill"
           sandbox="allow-scripts allow-same-origin"
+          scrolling="no"
           src="http://foo.bar/iframe/amp"
           title="Media player"
         >
@@ -69,6 +70,7 @@ exports[`Media Player: AMP Entry renders a portrait container with amp-iframe an
           frameborder="0"
           layout="fill"
           sandbox="allow-scripts allow-same-origin"
+          scrolling="no"
           src="http://foo.bar/iframe/amp"
           title="Media player"
         >
@@ -113,6 +115,7 @@ exports[`Media Player: AMP Entry renders the audio skin 1`] = `
           frameborder="0"
           layout="fill"
           sandbox="allow-scripts allow-same-origin"
+          scrolling="no"
           src="https://www.test.bbc.com/ws/av-embeds/media/bbc_korean_radio/liveradio"
           title="Audio player"
         >
@@ -625,6 +628,7 @@ exports[`Media Player: Canonical Entry renders an iframe when showPlaceholder is
     allow="autoplay; fullscreen"
     allowfullscreen=""
     class="c1"
+    scrolling="no"
     src="http://foo.bar/iframe"
     title="Media player"
   />
@@ -655,6 +659,7 @@ exports[`Media Player: Canonical Entry renders the audio skin 1`] = `
     allow="autoplay; fullscreen"
     allowfullscreen=""
     class="c1"
+    scrolling="no"
     src="https://www.test.bbc.com/ws/av-embeds/media/bbc_korean_radio/liveradio"
     title="Audio player"
   />