feat: Upgrade to Gatsby V3 (#66)

* Try with browserslist provided by gatsby

* Remove added peerdependency, included in subpackage

* Import from utils

* Load browserslist config manually

* Try to dynamically load browserslistrc

* Remove loading from .browserslistrc

* Load browserslist config via babel-preset-gatsby
Upgrade dependencies

* Add browerslist from package.json

* chore: Update node version in ci

* Fix tests

* Ugrade dependencies in root

Co-authored-by: hupe1980 <frankhuebner1980@gmail.com>

gatsby-plugin-material-ui/package.json

@@ -22,28 +22,30 @@
     "jest:watch": "jest --watch"
   },
   "dependencies": {
-    "autoprefixer": "^9.6.1",
-    "clean-css": "^4.2.1",
-    "postcss": "^7.0.17"
+    "autoprefixer": "^10.2.4",
+    "babel-preset-gatsby": "^1.0.0",
+    "clean-css": "^5.1.1",
+    "postcss": "^8.0.5"
   },
   "peerDependencies": {
     "@material-ui/styles": ">=4.0.0",
-    "gatsby": ">=2.0.33"
+    "gatsby": ">=3.0.0"
   },
   "devDependencies": {
-    "@babel/cli": "^7.5.5",
-    "@babel/core": "^7.5.5",
+    "@babel/cli": "^7.12.1",
+    "@babel/core": "^7.12.3",
     "babel-jest": "^24.8.0",
-    "babel-preset-gatsby-package": "^0.2.2",
-    "cross-env": "^5.2.0",
+    "babel-preset-gatsby-package": "^1.0.0",
+    "cross-env": "^7.0.3",
     "jest": "^24.8.0"
   },
   "jest": {
     "testMatch": [
       "<rootDir>/src/__tests__/**/*.test.js"
     ],
     "moduleNameMapper": {
-      "material-ui-plugin-cache-endpoint": "<rootDir>/src/__tests__/dummy-styles-provider-props.js"
+      "material-ui-plugin-cache-endpoint": "<rootDir>/src/__tests__/dummy-styles-provider-props.js",
+        "/package.json": "<rootDir>/src/__tests__/dummy-pkg.json"
     }
   }
 }

gatsby-plugin-material-ui/src/__tests__/dummy-pkg.json

@@ -0,0 +1,3 @@
+{
+  "browserslist": [">0.25%", "not dead"]
+}

gatsby-plugin-material-ui/src/autoprefixer.js

@@ -1,11 +1,18 @@
 import postcss from "postcss";
 import autoprefixer from "autoprefixer";
+import { browserslist } from "/package.json";
 
 export default function(css, pathname) {
-  const prefixer = postcss([autoprefixer]);
+  const prefixer = postcss([
+    autoprefixer({
+      overrideBrowserslist: browserslist
+        ? browserslist
+        : [`>0.25%`, `not dead`],
+    }),
+  ]);
 
   try {
-    return prefixer.process(css, { from: undefined }).css;
+    return prefixer.process(css, { from: null }).css;
   } catch (error) {
     if (error.name === `CssSyntaxError`) {
       throw new Error(`Pathname: ${pathname} ${error.toString()}`);