gatsbyjs · pieh · Mar 1, 2021 · Feb 23, 2021 · Feb 23, 2021 · Feb 23, 2021
diff --git a/e2e-tests/development-runtime/cypress/integration/functionality/hooks.js b/e2e-tests/development-runtime/cypress/integration/functionality/hooks.js
@@ -2,7 +2,7 @@ const COUNT_ID = `count`
 
 describe(`hooks`, () => {
   beforeEach(() => {
-    cy.visit(`/hooks`).waitForRouteChange()
+    cy.visit(`/hooks`, { failOnStatusCode: false }).waitForRouteChange()
   })
 
   it(`displays initial state`, () => {

diff --git a/e2e-tests/development-runtime/cypress/integration/functionality/query-data-caches.js b/e2e-tests/development-runtime/cypress/integration/functionality/query-data-caches.js
@@ -110,7 +110,9 @@ function pageTitleAndDataAssertion(config) {
 function runTests(config) {
   preTestSetup(config)
 
-  cy.visit(`/query-data-caches/${config.slug}/page-A/`).waitForRouteChange()
+  cy.visit(`/query-data-caches/${config.slug}/page-A/`, {
+    failOnStatusCode: false,
+  }).waitForRouteChange()
 
   setupForAssertingNotReloading()
 

diff --git a/e2e-tests/development-runtime/cypress/integration/navigation/linking.js b/e2e-tests/development-runtime/cypress/integration/navigation/linking.js
@@ -79,7 +79,9 @@ describe(`navigation`, () => {
 
   describe(`non-existent route`, () => {
     beforeEach(() => {
-      cy.getTestElement(`broken-link`).click().waitForRouteChange()
+      cy.getTestElement(`broken-link`)
+        .click({ failOnStatusCode: false })
+        .waitForRouteChange()
     })
 
     it(`displays 404 page on broken link`, () => {
@@ -134,7 +136,7 @@ describe(`navigation`, () => {
     })
 
     it(`should show 404 page when url with unicode characters point to a non-existent page route when navigating on client`, () => {
-      cy.visit(`/`).waitForRouteChange()
+      cy.visit(`/`, { failOnStatusCode: false }).waitForRouteChange()
       cy.window()
         .then(win => win.___navigate(`/안녕404/`))
         .waitForRouteChange()

diff --git a/e2e-tests/development-runtime/cypress/integration/navigation/redirect.js b/e2e-tests/development-runtime/cypress/integration/navigation/redirect.js
@@ -5,7 +5,9 @@ Cypress.on(`window:before:load`, win => {
 
 const runTests = () => {
   it(`should redirect page to index page when there is no such page`, () => {
-    cy.visit(`/redirect-without-page`).waitForRouteChange()
+    cy.visit(`/redirect-without-page`, {
+      failOnStatusCode: false,
+    }).waitForRouteChange()
 
     cy.location(`pathname`).should(`equal`, `/`)
     cy.then(() => {
@@ -42,7 +44,7 @@ const runTests = () => {
   })
 
   it(`should redirect to a dynamically-created replacement page`, () => {
-    cy.visit(`/redirect-me/`).waitForRouteChange()
+    cy.visit(`/redirect-me/`, { failOnStatusCode: false }).waitForRouteChange()
 
     cy.location(`pathname`).should(`equal`, `/pt/redirect-me/`)
     cy.then(() => {
@@ -65,7 +67,9 @@ describe(`redirect`, () => {
 
     // this is sanity check for this group
     it(`make sure 404 is present`, () => {
-      cy.visit(`/______not_existing_page`).waitForRouteChange()
+      cy.visit(`/______not_existing_page`, {
+        failOnStatusCode: false,
+      }).waitForRouteChange()
       cy.findByText("Preview custom 404 page").click()
       cy.findByText("A custom 404 page wasn't detected", {
         exact: false,
@@ -100,7 +104,9 @@ describe(`redirect`, () => {
     })
 
     it(`make sure 404 is NOT present`, () => {
-      cy.visit(`/______not_existing_page`).waitForRouteChange()
+      cy.visit(`/______not_existing_page`, {
+        failOnStatusCode: false,
+      }).waitForRouteChange()
       cy.findByText("Preview custom 404 page").click()
       cy.findByText("A custom 404 page wasn't detected", {
         exact: false,

diff --git a/e2e-tests/development-runtime/cypress/integration/page-not-found/404.js b/e2e-tests/development-runtime/cypress/integration/page-not-found/404.js
@@ -1,6 +1,6 @@
 describe(`page not found`, () => {
   beforeEach(() => {
-    cy.visit(`/__404__`)
+    cy.visit(`/__404__`, { failOnStatusCode: false })
   })
   it(`should display message `, () => {
     cy.get(`h1`).invoke(`text`).should(`eq`, `Gatsby.js development 404 page`)

diff --git a/packages/gatsby/cache-dir/app.js b/packages/gatsby/cache-dir/app.js
@@ -126,7 +126,7 @@ apiRunnerAsync(`onClientEntry`).then(() => {
     undefined,
     // Client only pages have any empty body so we just do a normal
     // render to avoid React complaining about hydration mis-matches.
-    document.getElementById(`___gatsby`).children.length === 0
+    document.getElementById(`gatsby-focus-wrapper`).children.length === 0
       ? ReactDOM.render
       : ReactDOM.hydrate
   )[0]

diff --git a/packages/gatsby/src/utils/dev-ssr/develop-html-route.ts b/packages/gatsby/src/utils/dev-ssr/develop-html-route.ts
@@ -10,13 +10,13 @@ export const route = ({ app, program, store }): any =>
   app.get(`*`, async (req, res, next) => {
     trackFeatureIsUsed(`GATSBY_EXPERIMENTAL_DEV_SSR`)
 
-    const pathObj = findPageByPath(store.getState(), req.path)
+    const pathObj = findPageByPath(store.getState(), decodeURI(req.path))
 
     if (!pathObj) {
       return next()
     }
 
-    await appendPreloadHeaders(req.path, res)
+    await appendPreloadHeaders(pathObj.path, res)
 
     const htmlActivity = report.phantomActivity(`building HTML for path`, {})
     htmlActivity.start()
@@ -152,7 +152,7 @@ export const route = ({ app, program, store }): any =>
           node.js, it errored.
         </p>
         <ul>
-          <li><strong>URL path:</strong> <code>${req.path}</code></li>
+          <li><strong>URL path:</strong> <code>${pathObj.path}</code></li>
           <li><strong>File path:</strong> <code>${error.filename}</code></li>
         </ul>
         <h3>error</h3>

diff --git a/packages/gatsby/src/utils/dev-ssr/render-dev-html.ts b/packages/gatsby/src/utils/dev-ssr/render-dev-html.ts
@@ -59,8 +59,13 @@ export const restartWorker = (htmlComponentRendererPath): void => {
 
 const searchFileForString = (substring, filePath): Promise<boolean> =>
   new Promise(resolve => {
+    const escapedSubString = substring.replace(/[.*+?^${}()|[\]\\]/g, `\\$&`)
+
     // See if the chunk is in the newComponents array (not the notVisited).
-    const chunkRegex = RegExp(`exports.ssrComponents.*${substring}.*}`, `gs`)
+    const chunkRegex = RegExp(
+      `exports.ssrComponents.*${escapedSubString}.*}`,
+      `gs`
+    )
     const stream = fs.createReadStream(filePath)
     let found = false
     stream.on(`data`, function (d) {

diff --git a/packages/gatsby/src/utils/develop-preload-headers.ts b/packages/gatsby/src/utils/develop-preload-headers.ts
@@ -43,7 +43,7 @@ export async function appendPreloadHeaders(
         `Link`,
         `</${path.join(
           `page-data`,
-          fixedPagePath(pagePath),
+          encodeURI(fixedPagePath(pagePath)),
           `page-data.json`
         )}>; rel=preload; as=fetch ; crossorigin`
       )

diff --git a/packages/gatsby/src/utils/flags.ts b/packages/gatsby/src/utils/flags.ts
@@ -1,8 +1,6 @@
 import _ from "lodash"
 import semver from "semver"
 
-import sampleSiteForExperiment from "./sample-site-for-experiment"
-
 // Does this experiment run for only builds
 type executingCommand = "build" | "develop" | "all"
 
@@ -94,13 +92,7 @@ const activeFlags: Array<IFlag> = [
     experimental: false,
     description: `Server Side Render (SSR) pages on full reloads during develop. Helps you detect SSR bugs and fix them without needing to do full builds.`,
     umbrellaIssue: `https://gatsby.dev/dev-ssr-feedback`,
-    testFitness: (): fitnessEnum => {
-      if (sampleSiteForExperiment(`DEV_SSR`, 20)) {
-        return `OPT_IN`
-      } else {
-        return true
-      }
-    },
+    testFitness: (): fitnessEnum => `LOCKED_IN`,
   },
   {
     name: `QUERY_ON_DEMAND`,