chore(v6): add codemod changing global to globalThis (redwoodjs#8924

)

The legacy Node.js `global` object is still supported in Webpack for
compatiblity reasons (src:
https://webpack.js.org/api/module-variables/#global-nodejs), and there's
a good chance that some projects are still using it because an old
project of @Tobbe's was.

Since this isn't supported in Vite, we should codemod it, especially
since it's as simple as a find and replace which jscodeshift already has
support for.

Co-authored-by: Tobbe Lundberg <tobbe@tlundberg.com>

packages/codemods/src/codemods/v6.x.x/changeGlobalToGlobalThis/README.md

@@ -0,0 +1,5 @@
+# Change Global To Global This
+
+The legacy Node.js `global` object is still supported in Webpack for compatiblity reasons (src: https://webpack.js.org/api/module-variables/#global-nodejs), and there's a good chance that some projects are still using it because an old project of @Tobbe's was.
+
+Since this isn't supported in Vite, we should codemod it, especially since it's as simple as a find and replace which jscodeshift already has support for.

packages/codemods/src/codemods/v6.x.x/changeGlobalToGlobalThis/__testfixtures__/default.input.js

@@ -0,0 +1,23 @@
+import { Link, routes } from '@redwoodjs/router'
+import { MetaTags } from '@redwoodjs/web'
+
+const HomePage = () => {
+  console.log(global)
+
+  return (
+    <>
+      <MetaTags title="Home" description="Home page" />
+
+      <h1>HomePage</h1>
+      <p>
+        Find me in <code>./web/src/pages/HomePage/HomePage.tsx</code>
+      </p>
+      <p>
+        My default route is named <code>home</code>, link to me with `
+        <Link to={routes.home()}>Home</Link>`
+      </p>
+    </>
+  )
+}
+
+export default HomePage

packages/codemods/src/codemods/v6.x.x/changeGlobalToGlobalThis/__testfixtures__/default.output.js

@@ -0,0 +1,23 @@
+import { Link, routes } from '@redwoodjs/router'
+import { MetaTags } from '@redwoodjs/web'
+
+const HomePage = () => {
+  console.log(globalThis)
+
+  return (
+    <>
+      <MetaTags title="Home" description="Home page" />
+
+      <h1>HomePage</h1>
+      <p>
+        Find me in <code>./web/src/pages/HomePage/HomePage.tsx</code>
+      </p>
+      <p>
+        My default route is named <code>home</code>, link to me with `
+        <Link to={routes.home()}>Home</Link>`
+      </p>
+    </>
+  )
+}
+
+export default HomePage

packages/codemods/src/codemods/v6.x.x/changeGlobalToGlobalThis/__tests__/changeGlobalToGlobalThis.test.ts

@@ -0,0 +1,5 @@
+describe('changeGlobalToGlobalThis', () => {
+  it('Converts global to globalThis', async () => {
+    await matchTransformSnapshot('changeGlobalToGlobalThis', 'default')
+  })
+})

packages/codemods/src/codemods/v6.x.x/changeGlobalToGlobalThis/changeGlobalToGlobalThis.ts

@@ -0,0 +1,12 @@
+import type { FileInfo, API } from 'jscodeshift'
+
+export default function transform(file: FileInfo, api: API) {
+  const j = api.jscodeshift
+  const ast = j(file.source)
+
+  ast
+    .find(j.Identifier, { name: 'global' })
+    .replaceWith(j.identifier('globalThis'))
+
+  return ast.toSource()
+}

packages/codemods/src/codemods/v6.x.x/changeGlobalToGlobalThis/changeGlobalToGlobalThis.yargs.ts

@@ -0,0 +1,25 @@
+import path from 'path'
+
+import fg from 'fast-glob'
+import task, { TaskInnerAPI } from 'tasuku'
+
+import { getPaths } from '@redwoodjs/project-config'
+
+import runTransform from '../../../lib/runTransform'
+
+export const command = 'change-global-to-global-this'
+export const description = '(v6.x.x->v6.x.x) Converts world to bazinga'
+
+export const handler = () => {
+  task('Change Global To Global This', async ({ setOutput }: TaskInnerAPI) => {
+    await runTransform({
+      transformPath: path.join(__dirname, 'changeGlobalToGlobalThis.js'),
+      targetPaths: fg.sync('**/*.{js,jsx,tsx}', {
+        cwd: getPaths().web.src,
+        absolute: true,
+      }),
+    })
+
+    setOutput('All done! Run `yarn rw lint --fix` to prettify your code')
+  })
+}