Make ESLint configuration aware of "env."

.eslintrc.js

@@ -0,0 +1,95 @@
+module.exports = {
+  extends: './packages/eslint-config/shared.js',
+  rules: {
+    '@typescript-eslint/no-explicit-any': 'off',
+    'import/order': [
+      'error',
+      {
+        'newlines-between': 'always',
+        pathGroupsExcludedImportTypes: ['react'],
+        pathGroups: [
+          {
+            pattern: 'react',
+            group: 'builtin',
+            position: 'after',
+          },
+          {
+            pattern: '@redwoodjs/**',
+            group: 'external',
+            position: 'after',
+          },
+          {
+            pattern: 'src/lib/test',
+            group: 'parent',
+            position: 'before',
+          },
+          {
+            pattern: 'src/**',
+            group: 'parent',
+            position: 'before',
+          },
+        ],
+        alphabetize: {
+          order: 'asc',
+          caseInsensitive: true,
+        },
+      },
+    ],
+  },
+  overrides: [
+    {
+      files: ['packages/structure/**'],
+      rules: {
+        '@typescript-eslint/no-this-alias': 'off',
+        '@typescript-eslint/no-non-null-assertion': 'off',
+        'no-case-declarations': 'off',
+        'prefer-const': 'off',
+        'no-empty': 'warn',
+        'no-unused-expressions': 'off',
+      },
+    },
+    // Browser Context
+    //
+    // We prevent "window" from being used, and instead require "global".
+    // This is because prerender runs in the NodeJS context it's undefined.
+    {
+      files: [
+        'packages/auth/src/**',
+        'packages/forms/src/**',
+        'packages/prerender/src/browserUtils/**',
+        'packages/router/src/**',
+        'packages/web/src/**',
+      ],
+      env: {
+        es6: true,
+        browser: true,
+      },
+      globals: {
+        React: 'readonly', // We auto-import React via Babel.
+        window: 'off', // Developers should use `global` instead of window. Since window is undefined in NodeJS.
+      },
+    },
+    // NodeJS Context
+    {
+      files: [
+        'packages/api/src/**',
+        'packages/api-server/src/**',
+        'packages/cli/src/**',
+        'packages/core/src/**',
+        'packages/core/config/**',
+        'packages/create-redwood-app/src/create-redwood-app.js',
+        'packages/dev-server/src/**',
+        'packages/internal/src/**',
+        'packages/prerender/src/**',
+        'packages/structure/src/**',
+        'packages/testing/src/**',
+        'packages/eslint-config/*.js',
+        'packages/eslint-plugin-redwood/src/**',
+      ],
+      env: {
+        es6: true,
+        node: true,
+      },
+    },
+  ],
+}

.github/workflows/build-eslint-jest.yaml

@@ -15,7 +15,7 @@ jobs:
       fail-fast: true
     runs-on: ${{ matrix.os }}
     name: ${{ matrix.os }} | Node ${{ matrix.node-version }} latest
-    steps:        
+    steps:
       - uses: actions/checkout@v2
 
       - name: Setup node
@@ -28,19 +28,19 @@ jobs:
         if: matrix.os == 'ubuntu-latest'
         with:
           path: '**/node_modules'
-          key: node_modules_${{ runner.os }}_${{ hashFiles('**/yarn.lock') }}  
+          key: node_modules_${{ runner.os }}_${{ hashFiles('**/yarn.lock') }}
 
       - name: Install dependencies
         run: yarn install --frozen-lockfile
 
+      - name: Build
+        run: yarn build
+
       - name: Run ESLint
         run: yarn lint
         env:
           CI: true
 
-      - name: Build
-        run: yarn build
-
       - name: Run tests
         run: yarn test
         env:

.github/workflows/publish-npm-canary.yaml

@@ -1,6 +1,3 @@
-# TODO: Figure out how to make this workflow depend on the build, lint, test
-# workflow. Then we don't have to double down on these run tasks.
-
 name: Publish canaray packages to npm
 
 on:
@@ -27,16 +24,20 @@ jobs:
           yarn --version
       - name: Install dependencies
         run: yarn install --frozen-lockfile --check-files
+
+      - name: Build
+        run: yarn build
+
       - name: Run ESLint
         run: yarn lint
         env:
           CI: true
-      - name: Build
-        run: yarn build
+
       - name: Run tests
         run: yarn test
         env:
           CI: true
+
       - name: Publish to npm
         run: |
           git fetch --depth=1 origin +refs/tags/*:refs/tags/*

package.json

@@ -5,8 +5,8 @@
     "build:clean": "rimraf ./packages/**/dist",
     "build:watch": "ttsc --build && lerna run build:watch --parallel",
     "test": "lerna run test --stream -- --colors --maxWorkers=4",
-    "lint": "eslint -c .eslintrc packages",
-    "lint:fix": "eslint -c .eslintrc --fix packages"
+    "lint": "eslint -c .eslintrc.js packages",
+    "lint:fix": "eslint -c .eslintrc.js --fix packages"
   },
   "private": true,
   "license": "MIT",

packages/cli/src/commands/test.js

@@ -29,7 +29,12 @@ export const command = 'test [side..]'
 export const description = 'Run Jest tests. Defaults to watch mode'
 export const builder = (yargs) => {
   yargs
-    .choices('side', getProject().sides)
+    .positional('side', {
+      choices: getProject().sides,
+      default: getProject().sides,
+      description: 'Which side(s) to test',
+      type: 'array',
+    })
     .option('watch', {
       describe:
         'Run tests related to changed files based on hg/git. Specify the name or path to a file to focus on a specific set of tests',

packages/cli/src/lib/test.js

@@ -1,3 +1,5 @@
+/* eslint-env jest */
+
 // Include at the top of your tests. Automatically mocks out the file system
 //
 // import { loadComponentFixture } from 'src/lib/test'

packages/core/src/configs/browser/jest.setup.js

@@ -1,3 +1,5 @@
+/* eslint-env jest */
+
 require('@testing-library/jest-dom')
 require('whatwg-fetch')
 

packages/core/src/configs/node/jest.setup.js

@@ -1,3 +1,4 @@
+/* eslint-env jest */
 const path = require('path')
 
 const { setContext } = require('@redwoodjs/api')
@@ -32,7 +33,7 @@ const teardown = async () => {
   }
 }
 
-window.scenario = (...args) => {
+global.scenario = (...args) => {
   let scenarioName, testName, testFunc
 
   if (args.length === 3) {
@@ -44,9 +45,9 @@ window.scenario = (...args) => {
     throw new Error('scenario() requires 2 or 3 arguments')
   }
 
-  return window.it(testName, async () => {
+  return global.it(testName, async () => {
     const path = require('path')
-    const testFileDir = path.parse(window.jasmine.testPath)
+    const testFileDir = path.parse(global.jasmine.testPath)
     const testFilePath = `${testFileDir.dir}/${
       testFileDir.name.split('.')[0]
     }.scenarios`
@@ -84,9 +85,9 @@ window.scenario = (...args) => {
   })
 }
 
-window.defineScenario = defineScenario
+global.defineScenario = defineScenario
 
-window.mockCurrentUser = (currentUser) => {
+global.mockCurrentUser = (currentUser) => {
   setContext({ currentUser })
 }
 

packages/core/src/storybook/StorybookProvider.tsx

@@ -1,4 +1,5 @@
-import { ReactNode, ReactPortal, useEffect, useState } from 'react'
+import type { ReactNode, ReactPortal } from 'react'
+import * as React from 'react'
 
 import {
   MockProviders,
@@ -10,9 +11,9 @@ export const StorybookProvider: React.FunctionComponent<{
   storyFn: () => ReactNode | ReactPortal
   id: string
 }> = ({ storyFn, id }) => {
-  const [loading, setLoading] = useState(true)
+  const [loading, setLoading] = React.useState(true)
 
-  useEffect(() => {
+  React.useEffect(() => {
     const init = async () => {
       // Import all the `*.mock.*` files.
       const reqs = require.context(

packages/create-redwood-app/template/package.json

@@ -11,7 +11,8 @@
     "@redwoodjs/core": "^0.25.1"
   },
   "eslintConfig": {
-    "extends": "@redwoodjs/eslint-config"
+    "extends": "@redwoodjs/eslint-config",
+    "root": true
   },
   "engines": {
     "node": ">=12",