Merge pull request #501 from Yoast/stories/upgrade-webpack-4

Upgraded webpack to 4.7
Yoast · May 7, 2018 · cb1bf09 · cb1bf09
2 parents 6b113cd + ffba0e2
commit cb1bf09
Show file tree

Hide file tree

Showing 8 changed files with 2,019 additions and 726 deletions.
diff --git a/composites/AlgoliaSearch/tests/__snapshots__/SearchResultDetailTest.js.snap b/composites/AlgoliaSearch/tests/__snapshots__/SearchResultDetailTest.js.snap
@@ -76,6 +76,7 @@ exports[`the SearchResultDetail component matches the snapshot 1`] = `
 }
 
 .c6 {
+  -webkit-text-decoration: none;
   text-decoration: none;
   color: #fff;
   background: #64a60a;

diff --git a/composites/Plugin/Shared/tests/__snapshots__/LinkButtonTest.js.snap b/composites/Plugin/Shared/tests/__snapshots__/LinkButtonTest.js.snap
@@ -55,6 +55,7 @@ exports[`the BaseLinkButton matches the snapshot 1`] = `
 }
 
 .c4 {
+  -webkit-text-decoration: none;
   text-decoration: none;
   color: #555;
   border-color: #ccc;
@@ -136,6 +137,7 @@ exports[`the LinkButton matches the snapshot 1`] = `
 }
 
 .c5 {
+  -webkit-text-decoration: none;
   text-decoration: none;
   color: #555;
   border-color: #ccc;

diff --git a/composites/Plugin/Shared/tests/__snapshots__/YoastLinkButtonTest.js.snap b/composites/Plugin/Shared/tests/__snapshots__/YoastLinkButtonTest.js.snap
@@ -44,6 +44,7 @@ exports[`the YoastLinkButton matches the snapshot 1`] = `
 }
 
 .c1 {
+  -webkit-text-decoration: none;
   text-decoration: none;
   color: #fff;
   background: #64a60a;

diff --git a/composites/Plugin/SnippetEditor/tests/__snapshots__/SnippetEditorTest.js.snap b/composites/Plugin/SnippetEditor/tests/__snapshots__/SnippetEditorTest.js.snap
@@ -18,6 +18,7 @@ exports[`SnippetEditor accepts a custom data mapping function 1`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -528,6 +529,7 @@ exports[`SnippetEditor calls callbacks when the editors are focused or changed 1
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -1781,6 +1783,7 @@ exports[`SnippetEditor calls callbacks when the editors are focused or changed 2
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -3034,6 +3037,7 @@ exports[`SnippetEditor calls callbacks when the editors are focused or changed 3
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -4287,6 +4291,7 @@ exports[`SnippetEditor closes when calling close() 1`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -5540,6 +5545,7 @@ exports[`SnippetEditor closes when calling close() 2`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -6422,6 +6428,7 @@ exports[`SnippetEditor colored progress bars can handle a score of 6 1`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -7707,6 +7714,7 @@ exports[`SnippetEditor colored progress bars can handle scores of 3 and 9 1`] =
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -9073,6 +9081,7 @@ exports[`SnippetEditor highlights a focused field 1`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -9502,6 +9511,7 @@ exports[`SnippetEditor highlights a hovered field 1`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -9931,6 +9941,7 @@ exports[`SnippetEditor highlights the active field when calling setFieldFocus 1`
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -11227,6 +11238,7 @@ exports[`SnippetEditor highlights the hovered field when onMouseOver() is called
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -12525,6 +12537,7 @@ exports[`SnippetEditor opens when calling open() 1`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -13778,6 +13791,7 @@ exports[`SnippetEditor passes replacement variables to the title and description
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -15086,6 +15100,7 @@ exports[`SnippetEditor passes the date prop 1`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -15614,6 +15629,7 @@ exports[`SnippetEditor renders in desktop mode 1`] = `
 
 .c5 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -16037,6 +16053,7 @@ exports[`SnippetEditor shows and editor 1`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;

diff --git a/composites/Plugin/SnippetPreview/tests/__snapshots__/SnippetPreviewTest.js.snap b/composites/Plugin/SnippetPreview/tests/__snapshots__/SnippetPreviewTest.js.snap
@@ -26,6 +26,7 @@ exports[`SnippetPreview changes the colors of the description if it was generate
 
 .c5 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -198,6 +199,7 @@ exports[`SnippetPreview highlights keywords even if they are transliterated 1`]
 
 .c5 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -373,6 +375,7 @@ exports[`SnippetPreview highlights keywords inside the description and url 1`] =
 
 .c5 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -544,6 +547,7 @@ exports[`SnippetPreview mobile mode renders an AMP logo when isAmp is true 1`] =
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -728,6 +732,7 @@ exports[`SnippetPreview mobile mode renders differently than desktop 1`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -898,6 +903,7 @@ exports[`SnippetPreview renders a SnippetPreview in the default mode 1`] = `
 
 .c4 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -1076,6 +1082,7 @@ exports[`SnippetPreview renders a SnippetPreview that looks like Google 1`] = `
 
 .c5 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -1248,6 +1255,7 @@ exports[`SnippetPreview renders a caret on activation 1`] = `
 
 .c6 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -1432,6 +1440,7 @@ exports[`SnippetPreview renders a caret on activation 2`] = `
 
 .c5 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -1616,6 +1625,7 @@ exports[`SnippetPreview renders a caret on activation 3`] = `
 
 .c5 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -1800,6 +1810,7 @@ exports[`SnippetPreview renders a caret on hover 1`] = `
 
 .c6 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -1984,6 +1995,7 @@ exports[`SnippetPreview renders a caret on hover 2`] = `
 
 .c5 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -2168,6 +2180,7 @@ exports[`SnippetPreview renders a caret on hover 3`] = `
 
 .c5 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;
@@ -2352,6 +2365,7 @@ exports[`SnippetPreview shows the date if a date is passed 1`] = `
 
 .c5 {
   color: #1e0fbe;
+  -webkit-text-decoration: none;
   text-decoration: none;
   font-size: 18px;
   line-height: 1.2;

diff --git a/package.json b/package.json
@@ -5,7 +5,7 @@
   "homepage": "https://github.com/Yoast/",
   "main": "index.js",
   "scripts": {
-    "start": "concurrently --kill-others \"stubby -d stubby/endpoints.yaml\" \"webpack-dev-server\"",
+    "start": "concurrently --kill-others \"stubby -d stubby/endpoints.yaml\" \"webpack-dev-server --mode=development\"",
     "test": "jest"
   },
   "jest": {
@@ -96,7 +96,6 @@
     "jest-mock": "^22.4.3",
     "jest-runtime": "^22.4.3",
     "jest-styled-components": "^5.0.1",
-    "json-loader": "^0.5.4",
     "load-grunt-config": "^0.19.2",
     "material-ui": "^0.18.6",
     "raf": "^3.4.0",
@@ -112,8 +111,9 @@
     "redux-mock-store": "^1.2.3",
     "sassdash": "^0.8.2",
     "stubby": "^0.3.1",
-    "webpack": "^3.5.5",
-    "webpack-dev-server": "^2.7.1"
+    "webpack": "^4.7.0",
+    "webpack-cli": "^2.1.3",
+    "webpack-dev-server": "^3.1.4"
   },
   "optionalDependencies": {
     "grunt-scss-to-json": "^1.0.1"

diff --git a/webpack.config.js b/webpack.config.js
@@ -64,10 +64,6 @@ module.exports = {
 					},
 				} ],
 			},
-			{
-				test: /\.json$/,
-				use: [ "json-loader" ],
-			},
 		],
 	},
 	plugins: [