Framework: update to react 16 (take three) (#19723)

* Revert "Revert "Framework: update to React 16, try 2" (#19609)" This reverts commit 577331f. * shrinkwrap * update the dependencies * downgrade notif-panel and shrinkwrap
Automattic · Nov 29, 2017 · b1c4fef · b1c4fef
1 parent eb823a2
commit b1c4fef
Show file tree

Hide file tree

Showing 8 changed files with 166 additions and 133 deletions.
diff --git a/client/components/root-child/test/index.jsx b/client/components/root-child/test/index.jsx
@@ -72,7 +72,7 @@ describe( 'RootChild', () => {
 			var tree = mount( React.createElement( Greeting ), { attachTo: container } );
 			tree.setProps( { toWhom: 'Universe' } );
 
-			expect( tree.ref( 'rootChild' ).textContent ).to.equal( 'Hello Universe!' );
+			expect( tree.ref( 'rootChild' ).innerHTML ).to.equal( 'Hello Universe!' );
 			tree.detach();
 		} );
 	} );

diff --git a/client/lib/embed-frame-markup/test/index.jsx b/client/lib/embed-frame-markup/test/index.jsx
@@ -1,7 +1,5 @@
 /** @format */
 
-/* eslint-disable max-len */
-
 /**
  * External dependencies
  */
@@ -12,14 +10,15 @@ import { expect } from 'chai';
  */
 import generateEmbedFrameMarkup from '../';
 
+/* eslint-disable max-len */
 describe( '#generateEmbedFrameMarkup()', () => {
 	test( 'should return an empty string if no arguments passed', () => {
 		expect( generateEmbedFrameMarkup() ).to.equal( '' );
 	} );
 
 	test( 'should generate markup with the body contents', () => {
 		expect( generateEmbedFrameMarkup( { body: 'Hello World' } ) ).to.equal(
-			'<html><head><style>a { cursor: default; }</style></head><body style="margin:0;"><div>Hello World</div><script src="https://s0.wp.com/wp-includes/js/jquery/jquery.js"></script><script>\n\t\t\t\t\t[ \'click\', \'dragstart\' ].forEach( function( type ) {\n\t\t\t\t\t\tdocument.addEventListener( type, function( event ) {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopImmediatePropagation();\n\t\t\t\t\t\t}, true );\n\t\t\t\t\t} );\n\t\t\t\t</script></body></html>'
+			'<html><head><style>a { cursor: default; }</style></head><body style="margin:0"><div>Hello World</div><script src="https://s0.wp.com/wp-includes/js/jquery/jquery.js"></script><script>\n\t\t\t\t\t[ \'click\', \'dragstart\' ].forEach( function( type ) {\n\t\t\t\t\t\tdocument.addEventListener( type, function( event ) {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopImmediatePropagation();\n\t\t\t\t\t\t}, true );\n\t\t\t\t\t} );\n\t\t\t\t</script></body></html>'
 		);
 	} );
 
@@ -33,7 +32,7 @@ describe( '#generateEmbedFrameMarkup()', () => {
 		};
 
 		expect( generateEmbedFrameMarkup( { styles } ) ).to.equal(
-			'<html><head><link rel="stylesheet" media="all" href="https://s1.wp.com/wp-content/mu-plugins/carousel/jetpack-carousel.css?m=1458924076h&amp;ver=20120629"/><style>a { cursor: default; }</style></head><body style="margin:0;"><div></div><script src="https://s0.wp.com/wp-includes/js/jquery/jquery.js"></script><script>\n\t\t\t\t\t[ \'click\', \'dragstart\' ].forEach( function( type ) {\n\t\t\t\t\t\tdocument.addEventListener( type, function( event ) {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopImmediatePropagation();\n\t\t\t\t\t\t}, true );\n\t\t\t\t\t} );\n\t\t\t\t</script></body></html>'
+			'<html><head><link rel="stylesheet" media="all" href="https://s1.wp.com/wp-content/mu-plugins/carousel/jetpack-carousel.css?m=1458924076h&amp;ver=20120629"/><style>a { cursor: default; }</style></head><body style="margin:0"><div></div><script src="https://s0.wp.com/wp-includes/js/jquery/jquery.js"></script><script>\n\t\t\t\t\t[ \'click\', \'dragstart\' ].forEach( function( type ) {\n\t\t\t\t\t\tdocument.addEventListener( type, function( event ) {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopImmediatePropagation();\n\t\t\t\t\t\t}, true );\n\t\t\t\t\t} );\n\t\t\t\t</script></body></html>'
 		);
 	} );
 
@@ -46,7 +45,7 @@ describe( '#generateEmbedFrameMarkup()', () => {
 		};
 
 		expect( generateEmbedFrameMarkup( { scripts } ) ).to.equal(
-			'<html><head><style>a { cursor: default; }</style></head><body style="margin:0;"><div></div><script src="https://s0.wp.com/wp-includes/js/jquery/jquery.js"></script><script>\n\t\t\t\t\t[ \'click\', \'dragstart\' ].forEach( function( type ) {\n\t\t\t\t\t\tdocument.addEventListener( type, function( event ) {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopImmediatePropagation();\n\t\t\t\t\t\t}, true );\n\t\t\t\t\t} );\n\t\t\t\t</script><script>var jpfbembed = {"appid":"249643311490"};</script><script src="https://s2.wp.com/wp-content/mu-plugins/shortcodes/js/facebook.js?ver"></script></body></html>'
+			'<html><head><style>a { cursor: default; }</style></head><body style="margin:0"><div></div><script src="https://s0.wp.com/wp-includes/js/jquery/jquery.js"></script><script>\n\t\t\t\t\t[ \'click\', \'dragstart\' ].forEach( function( type ) {\n\t\t\t\t\t\tdocument.addEventListener( type, function( event ) {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopImmediatePropagation();\n\t\t\t\t\t\t}, true );\n\t\t\t\t\t} );\n\t\t\t\t</script><script>var jpfbembed = {"appid":"249643311490"};</script><script src="https://s2.wp.com/wp-content/mu-plugins/shortcodes/js/facebook.js?ver"></script></body></html>'
 		);
 	} );
 } );
diff --git a/client/post-editor/media-modal/markup.js b/client/post-editor/media-modal/markup.js
@@ -114,7 +114,7 @@ Markup = {
 					parsed.attrs.named.align,
 					parsed.attrs.named.classes
 				) }
-				style={ { width: width } }
+				style={ { width: parseInt( width, 10 ) } }
 			>
 				<dt className="wp-caption-dt" dangerouslySetInnerHTML={ { __html: img } } />
 				<dd className="wp-caption-dd">{ caption }</dd>

diff --git a/client/post-editor/media-modal/test/markup.js b/client/post-editor/media-modal/test/markup.js
@@ -80,7 +80,7 @@ describe( 'markup', () => {
 
 			expect( value.type ).to.equal( 'dl' );
 			expect( ReactDomServer.renderToStaticMarkup( value ) ).to.equal(
-				'<dl class="wp-caption" style="width:276px;"><dt class="wp-caption-dt"><img src="https://s1.wp.com/wp-content/themes/a8c/automattic-2011/images/automattic-logo.png" alt="Automattic" width="276" class="alignnone size-full wp-image-1"/></dt><dd class="wp-caption-dd">Logo</dd></dl>'
+				'<dl class="wp-caption" style="width:276px"><dt class="wp-caption-dt"><img src="https://s1.wp.com/wp-content/themes/a8c/automattic-2011/images/automattic-logo.png" alt="Automattic" width="276" class="alignnone size-full wp-image-1"/></dt><dd class="wp-caption-dd">Logo</dd></dl>'
 			);
 		} );
 
@@ -104,7 +104,7 @@ describe( 'markup', () => {
 
 			expect( value.type ).to.equal( 'dl' );
 			expect( ReactDomServer.renderToStaticMarkup( value ) ).to.equal(
-				'<dl class="wp-caption aligncenter" style="width:660px;"><dt class="wp-caption-dt"><img class="size-full wp-image-1627" src="https://andrewmduthietest.files.wordpress.com/2015/01/img_0372.jpg" alt="Example" width="660" height="660" /></dt><dd class="wp-caption-dd">Ceramic</dd></dl>'
+				'<dl class="wp-caption aligncenter" style="width:660px"><dt class="wp-caption-dt"><img class="size-full wp-image-1627" src="https://andrewmduthietest.files.wordpress.com/2015/01/img_0372.jpg" alt="Example" width="660" height="660" /></dt><dd class="wp-caption-dd">Ceramic</dd></dl>'
 			);
 		} );
 	} );