add tests to e2e/dev

e2e-tests/development-runtime/cypress/integration/unified-routing/collection-routing.js

@@ -1,15 +1,56 @@
-describe(`collection-routing`, () => {
-  beforeEach(() => {
-    cy.visit(`/collection-routing`).waitForRouteChange()
+function assert404(slug) {
+  cy.visit(`/collection-routing/mutations/${slug}/`, {
+    failOnStatusCode: false,
+  }).waitForRouteChange()
+
+  // page doesn't exist yet
+  cy.get(`h1`).invoke(`text`).should(`eq`, `Gatsby.js development 404 page`)
+
+  cy.visit(`/collection-routing/mutations/child-${slug}/`, {
+    failOnStatusCode: false,
+  }).waitForRouteChange()
+
+  // page doesn't exist yet
+  cy.get(`h1`).invoke(`text`).should(`eq`, `Gatsby.js development 404 page`)
+}
+
+function assertPageExist(slug, content) {
+  cy.visit(`/collection-routing/mutations/${slug}/`).waitForRouteChange()
+  cy.contains(content)
+
+  cy.visit(`/collection-routing/mutations/child-${slug}/`).waitForRouteChange()
+  cy.contains(content)
+}
+
+function refresh(setup) {
+  cy.then(() => {
+    console.log(`fetch`, fetch)
+    return fetch(
+      `http://localhost:8000/__refresh/gatsby-source-fs-route-mutations`,
+      {
+        method: `POST`,
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({ setup }),
+      }
+    ).then(() => {
+      console.log(`fetched`)
+    })
   })
 
+  cy.wait(5000)
+}
+
+describe(`collection-routing`, () => {
   it(`can create simplest collection route that also has a number as an identifier`, () => {
     cy.visit(`/collection-routing/1/`).waitForRouteChange()
     cy.findByTestId(`slug`).should(`have.text`, `/preview/1`)
     cy.findByTestId(`pagecontext`).should(`have.text`, `1`)
   })
 
   it(`can navigate to a collection route and see its content rendered`, () => {
+    cy.visit(`/collection-routing`).waitForRouteChange()
     // this test depends on the alphabetical sorting of markdown files
     cy.findByTestId(`collection-routing-blog-0`)
       .should(`have.attr`, `data-testslug`, `/2018-12-14-hello-world/`)
@@ -24,6 +65,7 @@ describe(`collection-routing`, () => {
   })
 
   it(`can navigate to a collection route that uses unions and see its content rendered`, () => {
+    cy.visit(`/collection-routing`).waitForRouteChange()
     // this test depends on the alphabetical sorting of image files
     cy.findByTestId(`collection-routing-image-0`)
       .should(`have.attr`, `data-testimagename`, `citrus-fruits`)
@@ -61,4 +103,49 @@ describe(`collection-routing`, () => {
     cy.findByTestId(`title`)
     cy.should(`have.text`, `Named SPLAT Nested with Collection Route!`)
   })
+
+  describe(`data updates`, () => {
+    before(() => {
+      refresh(`reset`)
+    })
+    after(() => {
+      refresh(`reset`)
+    })
+
+    it(`creates a page when new node is created`, () => {
+      assert404(`new-node`)
+      assert404(`updated-node`)
+
+      refresh(`create`)
+
+      assertPageExist(`new-node`, `This is node that was just created`)
+      assert404(`updated-node`)
+    })
+
+    it(`remove previous page and add a new one when slug changes`, () => {
+      assertPageExist(`new-node`, `This is node that was just created`)
+      assert404(`updated-node`)
+
+      refresh(`update`)
+
+      assertPageExist(
+        `updated-node`,
+        `This is node that had slug and content updated`
+      )
+      assert404(`new-node`)
+    })
+
+    it(`remove a page when node is deleted`, () => {
+      assertPageExist(
+        `updated-node`,
+        `This is node that had slug and content updated`
+      )
+      assert404(`new-node`)
+
+      refresh(`delete`)
+
+      assert404(`new-node`)
+      assert404(`updated-node`)
+    })
+  })
 })

e2e-tests/development-runtime/gatsby-config.js

@@ -37,6 +37,7 @@ module.exports = {
     `gatsby-source-fake-data`,
     `gatsby-source-pinc-data`,
     `gatsby-source-query-on-demand-data`,
+    `gatsby-source-fs-route-mutations`,
     `gatsby-browser-tsx`,
     `gatsby-node-typegen`,
     `gatsby-transformer-sharp`,

e2e-tests/development-runtime/plugins/gatsby-source-fs-route-mutations/gatsby-node.ts

@@ -0,0 +1,84 @@
+import { GatsbyNode } from "gatsby"
+
+let createdNodes = new Set<string>()
+
+export const sourceNodes: GatsbyNode["sourceNodes"] = ({
+  actions,
+  webhookBody,
+  getNode,
+  createContentDigest,
+  reporter,
+}) => {
+  const handledNodes = new Set(createdNodes)
+  function addNode(data: { id: string; slug: string; content: string }): void {
+    const node = {
+      ...data,
+      parent: null,
+      children: [],
+      internal: {
+        type: `FilesystemRoutesMutation`,
+        contentDigest: createContentDigest(data),
+      },
+    }
+
+    createdNodes.add(node.id)
+    handledNodes.delete(node.id)
+
+    actions.createNode(node)
+
+    const childNode = {
+      ...data,
+      id: `${node.id} << childNode`,
+      parent: node.id,
+      internal: {
+        type: `FilesystemRoutesMutationChild`,
+        contentDigest: node.internal.contentDigest,
+      },
+    }
+    actions.createNode(childNode)
+    const parent = getNode(node.id)
+
+    if (!parent) {
+      throw new Error(`Could not find parent node`)
+    }
+
+    actions.createParentChildLink({
+      parent: parent,
+      child: childNode,
+    })
+  }
+
+  if (webhookBody?.setup === `create`) {
+    reporter.verbose(`[gatsby-source-fs-route-mutation] create a new node`)
+    addNode({
+      id: `fs-route-mutation-test`,
+      slug: `new-node`,
+      content: `This is node that was just created`,
+    })
+  } else if (webhookBody?.setup === `update`) {
+    reporter.verbose(`[gatsby-source-fs-route-mutation] update a node`)
+    addNode({
+      id: `fs-route-mutation-test`,
+      slug: `updated-node`,
+      content: `This is node that had slug and content updated`,
+    })
+  } else if (webhookBody?.setup === `delete`) {
+    reporter.verbose(`[gatsby-source-fs-route-mutation] delete a node`)
+  } else {
+    reporter.verbose(`[gatsby-source-fs-route-mutation] initial setup`)
+  }
+
+  addNode({
+    id: `fs-route-mutation-stable`,
+    slug: `stable`,
+    content: `This is stable node`,
+  })
+
+  for (const nodeIdToDelete of handledNodes) {
+    const nodeToDelete = getNode(nodeIdToDelete)
+    if (nodeToDelete) {
+      createdNodes.delete(nodeIdToDelete)
+      actions.deleteNode(nodeToDelete)
+    }
+  }
+}

e2e-tests/development-runtime/plugins/gatsby-source-fs-route-mutations/index.js

@@ -0,0 +1 @@
+// noop

e2e-tests/development-runtime/plugins/gatsby-source-fs-route-mutations/package.json

@@ -0,0 +1 @@
+{}

e2e-tests/development-runtime/src/pages/collection-routing/mutations/child-{FilesystemRoutesMutationChild.slug}.js

@@ -0,0 +1,18 @@
+import React from "react"
+import { graphql } from "gatsby"
+
+export default function FSRoutesMutationTemplate({ data }) {
+  return (
+    <>
+      <pre>{JSON.stringify(data, null, 2)}</pre>
+    </>
+  )
+}
+
+export const query = graphql`
+  query($id: String!) {
+    filesystemRoutesMutationChild(id: { eq: $id }) {
+      content
+    }
+  }
+`

e2e-tests/development-runtime/src/pages/collection-routing/mutations/{FilesystemRoutesMutation.slug}.js

@@ -0,0 +1,18 @@
+import React from "react"
+import { graphql } from "gatsby"
+
+export default function FSRoutesMutationTemplate({ data }) {
+  return (
+    <>
+      <pre>{JSON.stringify(data, null, 2)}</pre>
+    </>
+  )
+}
+
+export const query = graphql`
+  query($id: String!) {
+    filesystemRoutesMutation(id: { eq: $id }) {
+      content
+    }
+  }
+`