Add util for generating new tests/error documents

contributing.md

@@ -203,15 +203,8 @@ In general, all warnings and errors added should have these links attached.
 
 Below are the steps to add a new link:
 
-1. Create a new markdown file under the `errors` directory based on
-   `errors/template.md`:
-
-   ```shell
-   cp errors/template.md errors/<error-file-name>.md
-   ```
-
-2. Add the newly added file to `errors/manifest.json`
-3. Add the following url to your warning/error:
+1. Run `yarn new-error` which will create the error document and update the manifest automatically.
+2. Add the following url to your warning/error:
    `https://nextjs.org/docs/messages/<file-path-without-dotmd>`.
 
    For example, to link to `errors/api-routes-static-export.md` you use the url:

errors/template.md → errors/template.txt

@@ -1,4 +1,4 @@
-# <!-- INSERT TITLE HERE -->
+# {{title}}
 
 #### Why This Error Occurred
 

package.json

@@ -6,6 +6,8 @@
     "packages/*"
   ],
   "scripts": {
+    "new-error": "plop error",
+    "new-test": "plop test",
     "clean": "yarn lerna clean -y && yarn lerna bootstrap && yarn lerna exec 'rm -rf ./dist'",
     "build": "yarn prepublish",
     "lerna": "lerna",
@@ -128,6 +130,7 @@
     "nprogress": "0.2.0",
     "pixrem": "5.0.0",
     "playwright-chromium": "1.14.1",
+    "plop": "3.0.5",
     "postcss-nested": "4.2.1",
     "postcss-pseudoelements": "5.0.0",
     "postcss-short-size": "4.0.0",

plopfile.js

@@ -0,0 +1,71 @@
+module.exports = function (plop) {
+  function getFileName(str) {
+    return str.toLowerCase().replace(/ /g, '-')
+  }
+
+  plop.setGenerator('test', {
+    description: 'Create a new test',
+    prompts: [
+      {
+        type: 'input',
+        name: 'name',
+        message: 'Test name',
+      },
+      {
+        type: 'list',
+        name: 'type',
+        message: 'Test type',
+        choices: ['e2e', 'unit', 'production', 'development'],
+      },
+    ],
+    actions: function (data) {
+      const fileName = getFileName(data.name)
+      return [
+        {
+          type: 'add',
+          templateFile: `test/${
+            data.type === 'unit' ? 'unit' : 'e2e'
+          }/example.txt`,
+          path: `test/{{type}}/${
+            data.type === 'unit'
+              ? `${fileName}.test.ts`
+              : `${fileName}/index.test.ts`
+          }`,
+        },
+      ]
+    },
+  })
+
+  plop.setGenerator('error', {
+    description: 'Create a new error document',
+    prompts: [
+      {
+        name: 'title',
+        type: 'input',
+        message: 'Title for the error',
+      },
+    ],
+    actions: function (data) {
+      const fileName = getFileName(data.title)
+      return [
+        {
+          type: 'add',
+          path: `errors/${fileName}.md`,
+          templateFile: `errors/template.txt`,
+        },
+        {
+          type: 'modify',
+          path: 'errors/manifest.json',
+          transform(fileContents, data) {
+            const manifestData = JSON.parse(fileContents)
+            manifestData.routes[0].routes.push({
+              title: fileName,
+              path: `/errors/${fileName}.md`,
+            })
+            return JSON.stringify(manifestData, null, 2)
+          },
+        },
+      ]
+    },
+  })
+}

test/e2e/example.test.txt → test/e2e/example.txt

@@ -1,7 +1,8 @@
 import { createNext } from 'e2e-utils'
 import { NextInstance } from 'test/lib/next-modes/base'
+import { renderViaHTTP } from 'next-test-utils'
 
-describe('should set-up next', () => {
+describe('{{name}}', () => {
   let next: NextInstance
 
   beforeAll(async () => {
@@ -13,11 +14,13 @@ describe('should set-up next', () => {
           } 
         `
       },
+      dependencies: {}
     })
   })
   afterAll(() => next.destroy())
 
   it('should work', async () => {
-    console.log(next.url, next.appPort)
+    const html = await renderViaHTTP(next.url, '/')
+    expect(html).toContain('hello world')
   })
 })

test/readme.md

@@ -1,6 +1,10 @@
 # Writing tests for Next.js
 
-## Test types in Next.js
+## Getting Started
+
+You can set-up a new test using `yarn new-test` which will start from a template related to the test type.
+
+## Test Types in Next.js
 
 - e2e: These tests will run against `next dev` and `next start`
 - development: These tests only run against `next dev`
@@ -12,7 +16,9 @@ For the e2e, production, and development tests the `createNext` utility should b
 
 All new test suites should be written in TypeScript either `.ts` (or `.tsx` for unit tests). This will help ensure we catch smaller issues in tests that could cause flakey or incorrect tests.
 
-## Best practices
+If a test suite already exists that relates closely to the item being tested (e.g. hash navigation relates to existing navigation test suites) the new checks can be added in the existing test suite.
+
+## Best Practices
 
 - When checking for a condition that might take time, ensure it is waited for either using the browser `waitForElement` or using the `check` util in `next-test-utils`.
 - When applying a fix, ensure the test fails without the fix. This makes sure the test will properly catch regressions.

test/unit/example.txt

@@ -0,0 +1,5 @@
+describe('{{name}}', () => {
+  it('should work', async () => {
+    expect(typeof 'hello').toBe('string')
+  })
+})