test(e2e): add removing .babelrc case

Author: pieh

e2e-tests/development-runtime/cypress/integration/functionality/babelrc.js

@@ -87,5 +87,30 @@ describe(`babelrc`, () => {
         .invoke(`text`)
         .should(`eq`, `babel-rc-added`)
     })
+
+    it(`removing .babelrc`, () => {
+      cy.visit(`/babelrc/remove/`).waitForRouteChange()
+
+      cy.getTestElement(TEST_ELEMENT)
+        .invoke(`text`)
+        .should(`eq`, `babel-rc-will-be-deleted`)
+
+      cy.exec(
+        `npm run update -- --file src/pages/babelrc/remove/.babelrc --delete`
+      )
+
+      // babel-loader doesn't actually hot reloads itself when .babelrc file is deleted
+      // so to test hot-reloading here we actually have to invalidate js file, which would recompile it and discover
+      // new babelrc file
+      cy.exec(
+        `npm run update -- --file src/pages/babelrc/remove/index.js --replacements "foo-bar:foo-bar" --exact`
+      )
+
+      cy.waitForHmr()
+
+      cy.getTestElement(TEST_ELEMENT)
+        .invoke(`text`)
+        .should(`eq`, `babel-rc-test`)
+    })
   })
 })

e2e-tests/development-runtime/scripts/update.js

@@ -17,6 +17,10 @@ const args = yargs
     default: false,
     type: `boolean`,
   })
+  .option(`delete`, {
+    default: false,
+    type: `boolean`,
+  })
   .option(`fileContent`, {
     default: JSON.stringify(
       `
@@ -72,15 +76,21 @@ async function update() {
     history.set(filePath, exists ? file : false)
   }
 
-  const contents = replacements.reduce((replaced, pair) => {
-    const [key, value] = pair.split(`:`)
-    return replaced.replace(
-      args.exact ? key : new RegExp(`%${key}%`, `g`),
-      value
-    )
-  }, file)
+  if (args.delete) {
+    if (exists) {
+      await fs.remove(filePath)
+    }
+  } else {
+    const contents = replacements.reduce((replaced, pair) => {
+      const [key, value] = pair.split(`:`)
+      return replaced.replace(
+        args.exact ? key : new RegExp(`%${key}%`, `g`),
+        value
+      )
+    }, file)
 
-  await fs.writeFile(filePath, contents, `utf8`)
+    await fs.writeFile(filePath, contents, `utf8`)
+  }
 
   await writeHistory(history)
 }

e2e-tests/development-runtime/src/pages/babelrc/remove/.babelrc

@@ -0,0 +1,20 @@
+{
+  "plugins": [
+    [
+      "babel-plugin-search-and-replace",
+      {
+        "rules": [
+          {
+            "search": "babel-rc-test",
+            "replace": "babel-rc-will-be-deleted",
+            "searchTemplateStrings": true
+          }
+          
+        ]
+      }
+    ]
+  ],
+  "presets": [
+    "babel-preset-gatsby"
+  ]
+}

e2e-tests/development-runtime/src/pages/babelrc/remove/index.js

@@ -0,0 +1,13 @@
+import React from "react"
+
+export default function BabelrcRemove() {
+  return (
+    <>
+      <p>
+        Code block below should contain <code>babel-rc-will-be-deleted</code>{" "}
+        first and after removal it should contain <code>babel-rc-test</code>
+      </p>
+      <pre data-testid="test-element">babel-rc-test</pre>
+    </>
+  )
+}