Merge pull request #4916 from WordPress/try/fix-codepen-embed-width

Fix codepen embeds width
WordPress · Feb 7, 2018 · 0a73fb9 · 0a73fb9
2 parents 38f64cc + 31d2dc4
commit 0a73fb9
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 0 deletions.
diff --git a/components/sandbox/README.md b/components/sandbox/README.md
@@ -0,0 +1,14 @@
+This component is used to embed embeds!
+
+#### To test
+
+Embed the following:
+
+- Short tweet: https://twitter.com/notnownikki/status/876229494465581056
+- Long tweet with media: https://twitter.com/PattyJenks/status/874034832430424065
+- Video: https://www.youtube.com/watch?v=PfKUdmTq2MI
+- Photo: https://cloudup.com/cQFlxqtY4ob
+- Long tumblr post: http://doctorwho.tumblr.com/post/162052108791
+- Create a custom html block with the following content: <img src="https://cldup.com/G3fFjtKEKe-3000x3000.jpeg">
+
+This tests that HTML is written into the sandbox correctly in all cases, and that sites that do responsive resizes (e.g. tumblr) don't mess up when put into a small iframe that is also trying to resize.
diff --git a/components/sandbox/index.js b/components/sandbox/index.js
@@ -132,6 +132,7 @@ export default class Sandbox extends Component {
 				} );
 
 				document.body.style.position = 'absolute';
+				document.body.style.width = '100%';
 				document.body.setAttribute( 'data-resizable-iframe-connected', '' );
 
 				sendResize();