ember-codemod-v1-to-v2 0.1.0

package/LICENSE.md

@@ -0,0 +1,9 @@
+The MIT License (MIT)
+
+Copyright (c) 2023 Isaac J. Lee
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -0,0 +1,129 @@
+[![This project uses GitHub Actions for continuous integration.](https://github.com/ijlee2/ember-codemod-v1-to-v2/actions/workflows/ci.yml/badge.svg)](https://github.com/ijlee2/ember-codemod-v1-to-v2/actions/workflows/ci.yml)
+
+# ember-codemod-v1-to-v2
+
+_Codemod to convert Ember addons to v2 addon format_
+
+
+## Features
+
+- Scaffolds files according to [`@embroider/addon-blueprint`](https://github.com/embroider-build/addon-blueprint)
+- Switches Ember's "magic" import paths to relative paths
+- Preserves your code whenever possible
+- Supports [`ember-cli-typescript`](https://docs.ember-cli-typescript.com/) and [`glint`](https://typed-ember.gitbook.io/glint/)
+- Focuses on maintainbility and extensibility
+
+
+## Usage
+
+You can check [`ember-container-query`](https://github.com/ijlee2/ember-container-query/pull/151) as a reference.
+
+Step 1. Quickly migrate to [v2 format](https://github.com/embroider-build/embroider/blob/main/ADDON-AUTHOR-GUIDE.md).<sup>1</sup>
+
+```sh
+cd <your/project/path>
+npx ember-codemod-v1-to-v2 <arguments>
+```
+
+Step 2. Review the addon package.
+
+- [x] Update the configuration files.<sup>2</sup>
+- [x] Colocate stylesheets (if any). Let each component import the relevant stylesheet in the backing class.
+- [x] Confirm that you can run all scripts in `package.json`.
+
+Step 3. Review the test-app package.
+
+- [x] Update the configuration files.<sup>2</sup>
+- [x] Rename the remaining instances of `dummy` to `test-app`.
+- [x] Confirm that you can run all scripts in `package.json`.
+
+Step 4. Review the workspace root including CI/CD.
+
+Step 5. Celebrate.
+
+<sup>1. Before running `ember-codemod-v1-to-v2`, consider [meeting the prerequisites](https://github.com/embroider-build/embroider/blob/v1.8.3/PORTING-ADDONS-TO-V2.md#part-3-prerequisites-for-v2-addon). You can run [`ember-codemod-pod-to-octane`](https://github.com/ijlee2/ember-codemod-pod-to-octane) to un-pod a v1 addon.</sup>
+
+<sup>2. Files such as `.eslintrc.js`, `.gitignore`, `babel.config.json` (addon only), `config/environment.js` (test-app only), `ember-cli-build.js` (test-app only), `package.json`, `rollup.config.js` (addon only), `tsconfig.json`, etc.</sup>
+
+
+### Arguments
+
+In most cases, I recommend running the codemod without any arguments (i.e. allow the default values). This is to help different Ember projects converge to one layout.
+
+<details>
+<summary>Optional: Specify the addon location</summary>
+
+By default, the package name decides where the addon package lives. Pass `--addon-location` to override the logic. This may be useful if you have a scoped package.
+
+```sh
+npx ember-codemod-v1-to-v2 --addon-location="packages/ui-buttons"
+```
+
+</details>
+
+<details>
+<summary>Optional: Specify the project root</summary>
+
+Pass `--root` to run the codemod on a project somewhere else (i.e. not in the current directory).
+
+```sh
+npx ember-codemod-v1-to-v2 --root=<your/project/path>
+```
+
+</details>
+
+<details>
+<summary>Optional: Specify the test-app location</summary>
+
+By default, the test-app package lives in the folder `test-app`. Pass `--test-app-location` to override the logic.
+
+```sh
+npx ember-codemod-v1-to-v2 --test-app-location="docs"
+```
+
+</details>
+
+<details>
+<summary>Optional: Specify the test-app name</summary>
+
+By default, the test-app package is named `test-app`. Pass `--test-app-name` to override the logic. This may be useful if you have a workspace with many addons.
+
+```sh
+npx ember-codemod-v1-to-v2 --test-app-name="test-app-for-ui-buttons"
+```
+
+</details>
+
+
+### Limitations
+
+The codemod is designed to cover typical uses of an Ember addon. It is not designed to cover one-off cases (e.g. caused by a custom build).
+
+To better meet your needs, consider cloning the repo and running the codemod locally.
+
+```sh
+cd <your/cloned/repo>
+./bin/ember-codemod-v1-to-v2.js --root=<your/project/path>
+```
+
+You can also look at another codemod called [`ember-addon-migrator`](https://github.com/NullVoxPopuli/ember-addon-migrator).
+
+
+## Compatibility
+
+* Node.js v16 or above
+
+
+## Contributing
+
+If you have an open-sourced addon that I can use as a test fixture, reach out to me on [Discord](https://discord.gg/emberjs) at `ijlee2`. Please star this project so that I can gauge its importance to you and the Ember community. ⭐
+
+
+## Credits
+
+The codemod steps were based on [Migrating an Ember addon to the next-gen v2 format](https://www.kaliber5.de/de/blog/v2-addon_en) and [Guide: Porting an Addon to v2](https://github.com/embroider-build/embroider/blob/v1.8.3/PORTING-ADDONS-TO-V2.md). The blueprints were derived from [`@embroider/addon-blueprint`](https://github.com/embroider-build/addon-blueprint).
+
+
+## License
+
+This project is licensed under the [MIT License](LICENSE.md).

package/bin/ember-codemod-v1-to-v2.js

@@ -0,0 +1,42 @@
+#!/usr/bin/env node
+'use strict';
+
+import yargs from 'yargs';
+import { hideBin } from 'yargs/helpers';
+
+import { runCodemod } from '../src/index.js';
+
+// Provide a title to the process in `ps`
+process.title = 'ember-codemod-v1-to-v2';
+
+// Set codemod options
+const { argv } = yargs(hideBin(process.argv))
+  .option('addon-location', {
+    describe: 'Location of the addon package',
+    type: 'string',
+  })
+  .option('root', {
+    describe: 'Location of your Ember addon',
+    type: 'string',
+  })
+  .option('test-app-location', {
+    describe: 'Location of the test-app package',
+    type: 'string',
+  })
+  .option('test-app-name', {
+    describe: 'Name of the test-app package',
+    type: 'string',
+  });
+
+function castEmptyStringToUndefined(string) {
+  return string === '' ? undefined : string;
+}
+
+const options = {
+  addonLocation: castEmptyStringToUndefined(argv['addon-location']),
+  projectRoot: argv['root'] ?? process.cwd(),
+  testAppLocation: castEmptyStringToUndefined(argv['test-app-location']),
+  testAppName: castEmptyStringToUndefined(argv['test-app-name']),
+};
+
+runCodemod(options);

package/package.json

@@ -0,0 +1,67 @@
+{
+  "name": "ember-codemod-v1-to-v2",
+  "version": "0.1.0",
+  "description": "Codemod to convert Ember addons to v2 addon format",
+  "keywords": [
+    "codemod",
+    "ember-codemod",
+    "ember-octane",
+    "ember-polaris",
+    "ember-v2-addon",
+    "emberjs",
+    "embroider"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ijlee2/ember-codemod-v1-to-v2.git"
+  },
+  "license": "MIT",
+  "author": "Isaac J. Lee",
+  "main": "src/index.js",
+  "type": "module",
+  "bin": "./bin/ember-codemod-v1-to-v2.js",
+  "files": [
+    "bin/",
+    "src/"
+  ],
+  "directories": {
+    "test": "tests"
+  },
+  "scripts": {
+    "changelog": "lerna-changelog",
+    "lint": "eslint . --cache --ext=.cjs,.js",
+    "lint:fix": "eslint . --ext=.cjs,.js --fix",
+    "start": "node ./src/index.js",
+    "test": "mt tests --quiet"
+  },
+  "changelog": {
+    "labels": {
+      "breaking": "Breaking Change",
+      "bug": "Bug Fix",
+      "enhance: code": "Enhancement",
+      "enhance: dependency": "Internal",
+      "enhance: documentation": "Documentation",
+      "user feedback": "User Feedback"
+    }
+  },
+  "dependencies": {
+    "@babel/core": "^7.20.12",
+    "@babel/eslint-parser": "^7.19.1",
+    "glob": "^8.1.0",
+    "lodash.template": "^4.5.0",
+    "yargs": "^17.6.2"
+  },
+  "devDependencies": {
+    "@sondr3/minitest": "^0.1.1",
+    "eslint": "^8.32.0",
+    "eslint-config-prettier": "^8.6.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-simple-import-sort": "^8.0.0",
+    "fixturify": "^3.0.0",
+    "lerna-changelog": "^2.2.0",
+    "prettier": "^2.8.3"
+  },
+  "engines": {
+    "node": ">= 16"
+  }
+}

package/src/blueprints/ember-addon/.prettierignore

@@ -0,0 +1,25 @@
+# unconventional js
+/blueprints/*/files/
+/vendor/
+
+# compiled output
+/dist/
+/tmp/
+
+# dependencies
+/bower_components/
+/node_modules/
+
+# misc
+/coverage/
+!.*
+.*/
+.eslintcache
+
+# ember-try
+/.node_modules.ember-try/
+/bower.json.ember-try
+/npm-shrinkwrap.json.ember-try
+/package.json.ember-try
+/package-lock.json.ember-try
+/yarn.lock.ember-try

package/src/blueprints/ember-addon/.prettierrc.js

@@ -0,0 +1,5 @@
+'use strict';
+
+module.exports = {
+  singleQuote: true,
+};

package/src/blueprints/ember-addon/__addonLocation__/.eslintignore

@@ -0,0 +1,8 @@
+# unconventional js
+/blueprints/*/files/
+
+# compiled output
+/dist/
+
+# misc
+/coverage/

package/src/blueprints/ember-addon/__addonLocation__/addon-main.js

@@ -0,0 +1,5 @@
+'use strict';
+
+const { addonV1Shim } = require('@embroider/addon-shim');
+
+module.exports = addonV1Shim(__dirname);

package/src/blueprints/ember-addon/__addonLocation__/babel.config.json

@@ -0,0 +1,8 @@
+{
+<% if (options.packages.addon.hasTypeScript) { %>  "presets": [["@babel/preset-typescript"]],
+<% } %>  "plugins": [
+    "@embroider/addon-dev/template-colocation-plugin",
+    ["@babel/plugin-proposal-decorators", { "legacy": true }],
+    "@babel/plugin-proposal-class-properties"
+  ]
+}

package/src/blueprints/ember-addon/__addonLocation__/rollup.config.js

@@ -0,0 +1,58 @@
+import babel from '@rollup/plugin-babel';
+import copy from 'rollup-plugin-copy';
+import { Addon } from '@embroider/addon-dev/rollup';
+
+const addon = new Addon({
+  srcDir: 'src',
+  destDir: 'dist',
+});
+
+export default {
+  // This provides defaults that work well alongside `publicEntrypoints` below.
+  // You can augment this if you need to.
+  output: addon.output(),
+
+  plugins: [
+    // These are the modules that users should be able to import from your
+    // addon. Anything not listed here may get optimized away.
+    addon.publicEntrypoints([<%= context.publicEntrypoints.map((filePath) => `'${filePath}'`).join(', ') %>]),
+
+    // These are the modules that should get reexported into the traditional
+    // "app" tree. Things in here should also be in publicEntrypoints above, but
+    // not everything in publicEntrypoints necessarily needs to go here.
+    addon.appReexports([<%= context.appReexports.map((filePath) => `'${filePath}'`).join(', ') %>]),
+
+    // Follow the V2 Addon rules about dependencies. Your code can import from
+    // `dependencies` and `peerDependencies` as well as standard Ember-provided
+    // package names.
+    addon.dependencies(),
+
+    // This babel config should *not* apply presets or compile away ES modules.
+    // It exists only to provide development niceties for you, like automatic
+    // template colocation.
+    //
+    // By default, this will load the actual babel config from the file
+    // babel.config.json.
+    babel({
+      babelHelpers: 'bundled',
+    }),
+
+    // Ensure that standalone .hbs files are properly integrated as Javascript.
+    addon.hbs(),
+
+    // addons are allowed to contain imports of .css files, which we want rollup
+    // to leave alone and keep in the published output.
+    addon.keepAssets(['**/*.css']),
+
+    // Remove leftover build artifacts when starting a new build.
+    addon.clean(),
+
+    // Copy Readme and License into published package
+    copy({
+      targets: [
+        { src: '../README.md', dest: '.' },
+        { src: '../LICENSE.md', dest: '.' },
+      ],
+    }),
+  ],
+};

package/src/blueprints/ember-addon/__addonLocation__/rollup.config.mjs

@@ -0,0 +1,55 @@
+import typescript from 'rollup-plugin-ts';
+import copy from 'rollup-plugin-copy';
+import { Addon } from '@embroider/addon-dev/rollup';
+
+const addon = new Addon({
+  srcDir: 'src',
+  destDir: 'dist',
+});
+
+export default {
+  // This provides defaults that work well alongside `publicEntrypoints` below.
+  // You can augment this if you need to.
+  output: addon.output(),
+
+  plugins: [
+    // These are the modules that users should be able to import from your
+    // addon. Anything not listed here may get optimized away.
+    addon.publicEntrypoints([<%= context.publicEntrypoints.map((filePath) => `'${filePath}'`).join(', ') %>]),
+
+    // These are the modules that should get reexported into the traditional
+    // "app" tree. Things in here should also be in publicEntrypoints above, but
+    // not everything in publicEntrypoints necessarily needs to go here.
+    addon.appReexports([<%= context.appReexports.map((filePath) => `'${filePath}'`).join(', ') %>]),
+
+    // Follow the V2 Addon rules about dependencies. Your code can import from
+    // `dependencies` and `peerDependencies` as well as standard Ember-provided
+    // package names.
+    addon.dependencies(),
+
+    // compile TypeScript to latest JavaScript, including Babel transpilation
+    typescript({
+      transpiler: 'babel',
+      browserslist: false,
+      transpileOnly: false,
+    }),
+
+    // Ensure that standalone .hbs files are properly integrated as Javascript.
+    addon.hbs(),
+
+    // addons are allowed to contain imports of .css files, which we want rollup
+    // to leave alone and keep in the published output.
+    addon.keepAssets(['**/*.css']),
+
+    // Remove leftover build artifacts when starting a new build.
+    addon.clean(),
+
+    // Copy Readme and License into published package
+    copy({
+      targets: [
+        { src: '../README.md', dest: '.' },
+        { src: '../LICENSE.md', dest: '.' },
+      ],
+    }),
+  ],
+};

package/src/blueprints/ember-addon/__addonLocation__/unpublished-development-types/index.d.ts

@@ -0,0 +1,13 @@
+// Add any types here that you need for local development only.
+// These will *not* be published as part of your addon, so be careful that your published code does not rely on them!
+
+<% if (options.packages.addon.hasGlint) { %>import '@glint/environment-ember-loose';
+
+declare module '@glint/environment-ember-loose/registry' {
+  // Remove this once entries have been added! 👇
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  export default interface Registry {
+    // Add any registry entries from other addons here that your addon itself uses (in non-strict mode templates)
+    // See https://typed-ember.gitbook.io/glint/using-glint/ember/using-addons
+  }
+}<% } %>

package/src/blueprints/ember-addon/__testAppLocation__/ember-cli-build.js

@@ -0,0 +1,16 @@
+'use strict';
+
+const EmberApp = require('ember-cli/lib/broccoli/ember-app');
+
+module.exports = function (defaults) {
+  const app = new EmberApp(defaults, {
+    // Add options here
+    autoImport: {
+      watchDependencies: ['<%= options.packages.addon.name %>'],
+    },
+  });
+
+  const { maybeEmbroider } = require('@embroider/test-setup');
+
+  return maybeEmbroider(app);
+};

package/src/blueprints/ember-addon/__testAppLocation__/types/global.d.ts

@@ -0,0 +1,7 @@
+// Types for compiled templates
+declare module '<%= options.packages.testApp.name %>/templates/*' {
+  import { TemplateFactory } from 'ember-cli-htmlbars';
+
+  const tmpl: TemplateFactory;
+  export default tmpl;
+}

package/src/blueprints/ember-addon/package.json

@@ -0,0 +1,76 @@
+<% if (options.packageManager.isNpm) { %>{
+  "name": "<%= options.packages.addon.name %>",
+  "version": "<%= options.packages.addon.version %>",
+  "private": true,
+  "repository": "",
+  "license": "MIT",
+  "author": "",
+  "workspaces": [
+    "<%= options.packages.addon.name %>",
+    "<%= options.packages.testApp.name %>"
+  ],
+  "scripts": {
+    "build": "npm run build --workspace <%= options.packages.addon.name %>",
+    "lint": "npm run lint --workspaces --if-present",
+    "lint:fix": "npm run lint:fix --workspaces --if-present",
+    "prepare": "npm run build",
+    "start": "concurrently 'npm:start:*' --restart-after 5000 --prefix-colors cyan,white,yellow",
+    "start:addon": "npm start --workspace <%= options.packages.addon.name %>",
+    "start:tests": "npm start --workspace <%= options.packages.testApp.name %>",
+    "test": "npm run test --workspaces --if-present"
+  },
+  "devDependencies": {
+    "concurrently": "<%= options.packages.addon.dependencies.get('concurrently') ?? '^7.6.0' %>",
+    "prettier": "<%= options.packages.addon.dependencies.get('prettier') ?? '^2.8.3' %>"
+  }
+}<% } else if (options.packageManager.isPnpm) { %>{
+  "name": "<%= options.packages.addon.name %>",
+  "version": "<%= options.packages.addon.version %>",
+  "private": true,
+  "repository": "",
+  "license": "MIT",
+  "author": "",
+  "workspaces": [
+    "<%= options.packages.addon.name %>",
+    "<%= options.packages.testApp.name %>"
+  ],
+  "scripts": {
+    "build": "pnpm --filter <%= options.packages.addon.name %> build",
+    "lint": "pnpm --filter '*' lint",
+    "lint:fix": "pnpm --filter '*' lint:fix",
+    "prepare": "pnpm build",
+    "start": "concurrently 'npm:start:*' --restart-after 5000 --prefix-colors cyan,white,yellow",
+    "start:addon": "pnpm --filter <%= options.packages.addon.name %> start",
+    "start:test": "pnpm --filter <%= options.packages.testApp.name %> start",
+    "test": "pnpm --filter '*' test"
+  },
+  "devDependencies": {
+    "concurrently": "<%= options.packages.addon.dependencies.get('concurrently') ?? '^7.6.0' %>",
+    "prettier": "<%= options.packages.addon.dependencies.get('prettier') ?? '^2.8.3' %>"
+  }
+}<% } else if (options.packageManager.isYarn) { %>{
+  "name": "<%= options.packages.addon.name %>",
+  "version": "<%= options.packages.addon.version %>",
+  "private": true,
+  "repository": "",
+  "license": "MIT",
+  "author": "",
+  "workspaces": [
+    "<%= options.packages.addon.name %>",
+    "<%= options.packages.testApp.name %>"
+  ],
+  "scripts": {
+    "build": "yarn workspace <%= options.packages.addon.name %> run build",
+    "lint": "yarn workspaces run lint",
+    "lint:fix": "yarn workspaces run lint:fix",
+    "prepare": "yarn build",
+    "start": "concurrently 'npm:start:*' --restart-after 5000 --prefix-colors cyan,white,yellow",
+    "start:addon": "yarn workspace <%= options.packages.addon.name %> run start",
+    "start:test": "yarn workspace <%= options.packages.testApp.name %> run start",
+    "test": "yarn workspaces run test"
+  },
+  "devDependencies": {
+    "concurrently": "<%= options.packages.addon.dependencies.get('concurrently') ?? '^7.6.0' %>",
+    "prettier": "<%= options.packages.addon.dependencies.get('prettier') ?? '^2.8.3' %>"
+  }
+}<% } %>

package/src/blueprints/ember-addon/pnpm-workspace.yaml

@@ -0,0 +1,3 @@
+packages:
+  - '<%= options.packages.addon.name %>'
+  - '<%= options.packages.testApp.name %>'

package/src/index.js

@@ -0,0 +1,5 @@
+import { migrateEmberAddon } from './migration/index.js';
+
+export function runCodemod(options) {
+  migrateEmberAddon(options);
+}

package/src/migration/ember-addon/index.js

@@ -0,0 +1,41 @@
+import {
+  analyzeAddon,
+  augmentOptions,
+  createFilesFromBlueprint,
+  moveAddonFiles,
+  moveProjectRootFiles,
+  moveTestAppFiles,
+  updateAddonPackageJson,
+  updateAddonTsconfigJson,
+  updateTestAppPackageJson,
+  updateTestAppTsconfigJson,
+  useRelativePaths,
+} from './steps/index.js';
+
+export function migrateEmberAddon(options) {
+  const augmentedOptions = augmentOptions(options);
+  const { isV1Addon } = augmentedOptions.packages.addon;
+
+  // Guarantee idempotency
+  if (!isV1Addon) {
+    return;
+  }
+
+  // Prepare for migration
+  const context = analyzeAddon(augmentedOptions);
+  useRelativePaths(augmentedOptions);
+
+  // Preserve code
+  moveAddonFiles(augmentedOptions);
+  moveTestAppFiles(augmentedOptions);
+  moveProjectRootFiles(augmentedOptions);
+
+  // Get the latest code from blueprint
+  createFilesFromBlueprint(context, augmentedOptions);
+
+  // Fine-tune individual files
+  updateAddonPackageJson(augmentedOptions);
+  updateAddonTsconfigJson(augmentedOptions);
+  updateTestAppPackageJson(augmentedOptions);
+  updateTestAppTsconfigJson(augmentedOptions);
+}

package/src/migration/ember-addon/steps/analyze-addon.js

@@ -0,0 +1,30 @@
+import { join } from 'node:path';
+
+import glob from 'glob';
+
+function getAppReexports(options) {
+  const { projectRoot } = options;
+
+  const filePaths = glob.sync('**/*.js', {
+    cwd: join(projectRoot, 'app'),
+  });
+
+  return filePaths;
+}
+
+function getPublicEntrypoints(options) {
+  const { projectRoot } = options;
+
+  const filePaths = glob.sync('**/*.{js,ts}', {
+    cwd: join(projectRoot, 'addon'),
+  });
+
+  return filePaths.map((filePath) => filePath.replace(/ts$/, 'js'));
+}
+
+export function analyzeAddon(options) {
+  const appReexports = getAppReexports(options);
+  const publicEntrypoints = getPublicEntrypoints(options);
+
+  return { appReexports, publicEntrypoints };
+}