Merge branch 'main' into guide-for-deprecate-import-from-ember

Author: NullVoxPopuli

.github/workflows/ci.yml

@@ -7,7 +7,7 @@ on:
   pull_request:
 
 env:
-  NODE_VERSION: 14
+  NODE_VERSION: 20
   PERCY_PARALLEL_NONCE: ${{ github.run_id }}-${{ github.run_number }}
   PERCY_PARALLEL_TOTAL: 1
 
@@ -21,40 +21,28 @@ jobs:
     runs-on: ubuntu-latest
     timeout-minutes: 3
     steps:
-      - name: Check out a copy of the repo
-        uses: actions/checkout@v3
-
-      - name: Use Node.js ${{ env.NODE_VERSION }}
-        uses: actions/setup-node@v3
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
+      - uses: actions/setup-node@v4
         with:
-          cache: 'npm'
+          cache: 'pnpm'
           node-version: ${{ env.NODE_VERSION }}
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Lint
-        run: npm run lint
+      - run: pnpm i --frozen-lockfile
+      - run: pnpm run lint
 
   test-app:
     name: Test app
     runs-on: ubuntu-latest
     timeout-minutes: 3
     steps:
-      - name: Check out a copy of the repo
-        uses: actions/checkout@v3
-
-      - name: Use Node.js ${{ env.NODE_VERSION }}
-        uses: actions/setup-node@v3
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
+      - uses: actions/setup-node@v4
         with:
-          cache: 'npm'
+          cache: 'pnpm'
           node-version: ${{ env.NODE_VERSION }}
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Test
-        run: npx percy exec -- npm run test
+      - run: pnpm install --frozen-lockfile
+      - run: pnpm percy exec -- pnpm run test
         env:
           PERCY_PARALLEL_NONCE: ${{ env.PERCY_PARALLEL_NONCE }}
           PERCY_PARALLEL_TOTAL: ${{ env.PERCY_PARALLEL_TOTAL }}

.markdownlint.json

@@ -0,0 +1,19 @@
+{
+  "default": false,
+  "MD040": {
+    "allowed_languages": [
+      "js",
+      "ts",
+      "javascript",
+      "typescript",
+      "bash",
+      "shell",
+      "handlebars",
+      "plaintext",
+      "text",
+      "json",
+      "html",
+      "css"
+    ]
+  }
+}

.npmrc

@@ -0,0 +1 @@
+use-node-version=20.15.1

app/styles/app.scss

@@ -23,6 +23,36 @@ table {
   padding: 2rem;
 }
 
+// 404 styling
+.whoops {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: var(--spacing-6)
+}
+
+.whoops img {
+    width: 240px;
+    margin: var(--spacing-2);
+}
+
+@media (max-width: 450px) {
+  .whoops {
+    flex-direction: column;
+    padding: var(--spacing-3);
+  }
+
+  .whoops img {
+    width: 80%;
+    margin: var(--spacing-4);
+  }
+
+  .whoops__message {
+    margin: var(--spacing-2);
+    text-align: center;
+  }
+}
+
 // override ember-styleguide. Needed to contain code blocks.
 .main {
   grid-area: main;
@@ -97,24 +127,6 @@ table {
   width: 1px;
 }
 
-// anchor links used on h3 headings
-.toc-anchor {
-  display: inline;
-  margin-right: var(--spacing-1);
-
-  &,
-  main &,
-  main &:link,
-  main &:visited {
-    background: none;
-    color: var(--color-gray-500);
-  }
-
-  &:hover {
-    opacity: 0.75;
-  }
-}
-
 @media (max-width: 1007px) {
   body.no-scroll {
     overflow: hidden;
@@ -586,7 +598,9 @@ p a:hover {
         .ember-version-graphic {
           $height: 132px;
           width: $height;
-          height: $height;
+          min-height: $height;
+          height: inherit;
+          background-position-y: center;
 
           .text {
             font-size: 64px;

app/templates/components/main-layout.hbs

@@ -12,12 +12,17 @@
       {{#each result.contents as |content|}}
         <DeprecationArticle @model={{content}}>
           <h3 id="{{id-for-deprecation (or content.displayId content.id) content.anchor}}">
-            <LinkTo @route="id" @model={{content.id}} title={{content.title}} class="toc-anchor">§</LinkTo>
             {{markdown-to-html
               content.title
               extensions="no-wrapper"
               tagName=""
             }}
+            <LinkTo @route="id" @model={{content.id}} title={{content.title}}>
+              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                <path
+                  d="M326.61 185.4c59.75 59.8 58.93 155.69.36 214.58-.1.12-.24.25-.36.37l-67.2 67.2c-59.27 59.27-155.7 59.26-214.96 0-59.27-59.26-59.27-155.7 0-214.96l37.1-37.1c9.85-9.85 26.8-3.3 27.3 10.6a184.27 184.27 0 0 0 9.7 52.72 16.1 16.1 0 0 1-3.8 16.61l-13.08 13.1c-28.02 28.02-28.9 73.65-1.15 101.95 28.02 28.58 74.08 28.75 102.32.51l67.2-67.19a71.98 71.98 0 0 0-10.34-110.4 16.04 16.04 0 0 1-6.95-12.6 39.83 39.83 0 0 1 11.7-29.81l21.06-21.06a16.06 16.06 0 0 1 20.58-1.73 152.48 152.48 0 0 1 20.52 17.2zM467.55 44.44c-59.26-59.26-155.7-59.27-214.96 0l-67.2 67.2-.36.37c-58.57 58.9-59.39 154.78.36 214.59a152.45 152.45 0 0 0 20.52 17.2 16.07 16.07 0 0 0 20.58-1.74l21.06-21.05a39.83 39.83 0 0 0 11.7-29.8 16.04 16.04 0 0 0-6.95-12.61 71.98 71.98 0 0 1-10.34-110.4l67.2-67.2c28.23-28.23 74.3-28.06 102.32.52 27.75 28.3 26.87 73.93-1.15 101.96l-13.1 13.09a16.1 16.1 0 0 0-3.77 16.6c5.86 17.2 9.04 35 9.69 52.73.5 13.9 17.45 20.44 27.29 10.6l37.1-37.1c59.28-59.26 59.28-155.7 0-214.96z"></path>
+              </svg>
+            </LinkTo>
           </h3>
         </DeprecationArticle>
       {{/each}}

app/templates/error.hbs

@@ -0,0 +1,9 @@
+{{page-title "Page Not Found"}}
+
+<article class="whoops">
+  <img src="/images/stinky-fish.png" alt="tomster stinky fish"/>
+  <div class="whoops__message">
+    <h2>Ack! 404 friend, you're in the wrong place</h2>
+    <LinkTo @route='index'>Click here to go home</LinkTo>
+  </div>
+</article>

app/templates/index.hbs

@@ -52,6 +52,9 @@
         <li class='list-unstyled' data-test-ember-5-link>
           <LinkTo @route='ember' @model='v5.x'>v5.x</LinkTo>
         </li>
+        <li class='list-unstyled' data-test-ember-6-link>
+          <LinkTo @route='ember' @model='v6.x'>v6.x</LinkTo>
+        </li>
       </ul>
     </li>
     <li class='item list-unstyled'>
@@ -75,6 +78,12 @@
             @models={{array 'ember-cli' 'v5.x'}}
           >v5.x</LinkTo>
         </li>
+        <li class='list-unstyled' data-test-ember-cli-6-link>
+          <LinkTo
+            @route='show'
+            @models={{array 'ember-cli' 'v6.x'}}
+          >v6.x</LinkTo>
+        </li>
       </ul>
     </li>
     <li class='item list-unstyled'>

config/fastboot.js

@@ -1,4 +1,3 @@
-/* global atob */
 module.exports = function () {
   return {
     buildSandboxGlobals(defaultGlobals) {

content/ember-cli/v4/ember-cli-blacklist-whitelist-build-options.md

@@ -9,14 +9,12 @@ displayId: ember-cli.blacklist-whitelist-build-options
 Using the `blacklist` and `whitelist` build options has been deprecated. Please 
 use `exclude` and `include` respectively instead.
 
-```diff
-// ember-cli-build.js
-
+```js {data-filename="ember-cli-build.js" data-diff="-4,+5"}
 module.exports = function (defaults) {
   const app = new EmberApp(defaults, {
     addons: {
--     blacklist: ['addon-name'],
-+     exclude: ['addon-name'],
+      blacklist: ['addon-name'],
+      exclude: ['addon-name'],
     },
   };
 };

content/ember-cli/v5/ember-cli-output-paths-build-option.md

@@ -10,21 +10,21 @@ Using the `outputPaths` build option is deprecated, as output paths will no long
 
 To resolve the deprecation, please remove the `outputPaths` build option from your `ember-cli-build.js` file:
 
-```diff
+```js {data-diff="-3,-4,-5,-6,-7"}
 module.exports = function (defaults) {
   const app = new EmberApp(defaults, {
--   outputPaths: {
--     app: {
--       js: `/assets/foo.js`,
--     },
--   },
+    outputPaths: {
+      app: {
+        js: `/assets/foo.js`,
+      },
+    },
   };
 };
 ```
 
 And update your `app/index.html` file accordingly:
 
-```diff
+```html {data-diff="-20,+21"}
 <!DOCTYPE html>
 <html>
   <head>
@@ -44,8 +44,8 @@ And update your `app/index.html` file accordingly:
     {{content-for "body"}}
 
     <script src="{{rootURL}}assets/vendor.js"></script>
--   <script src="{{rootURL}}assets/foo.js"></script>
-+   <script src="{{rootURL}}assets/my-app-name.js"></script>
+    <script src="{{rootURL}}assets/foo.js"></script>
+    <script src="{{rootURL}}assets/my-app-name.js"></script>
 
     {{content-for "body-footer"}}
   </body>

content/ember-cli/v6/v1-addon-content-for-types.md

@@ -0,0 +1,32 @@
+---
+title: V1 addon contentFor types
+since: 6.3.0
+until: 7.0.0
+---
+`app-prefix`, `app-suffix`, `tests-prefix`, and `tests-suffix` are deprecated as types passed to `contentFor`. See [RFC 1029](https://rfcs.emberjs.com/id/1029-deprecate-app-prefix) for more information.
+
+#### app-prefix
+
+Returning content from an addon's `contentFor()` hook for `type="app-prefix"` is deprecated. Addons will no longer be allowed to inject arbitrary javascript here. If you need to provide code that apps will run before booting, document that app authors should import and call your code at the start of their own `app.js` file.
+
+#### app-suffix
+
+Returning content from an addon's `contentFor()` hook for `type="app-suffix"` is deprecated. Addons will no longer be allowed to inject arbitrary javascript here. If you need to provide code that apps will run before booting, document that app authors should import and call your code at the start of their own `app.js` file.
+
+If you were using app-suffix to overwrites modules provided by the app, that is intentionally not supported. Adjust your API to tell app authors to import your code and invoke it where appropriate.
+
+#### tests-prefix
+
+Returning content from an addon's `contentFor()` hook for `type="tests-prefix"` is deprecated. Addons will no longer be allowed to inject arbitrary javascript here. Provide utilities that users can import into their own test setup code instead.
+
+#### tests-suffix
+
+Returning content from an addon's `contentFor()` hook for `type="tests-suffix"` is deprecated. Addons will no longer be allowed to inject arbitrary javascript here. Provide utilities that users can import into their own test setup code instead.
+
+#### vendor-prefix
+
+Returning content from an addon's `contentFor()` hook for `type="vendor-prefix"` is deprecated. Addons will no longer be allowed to inject arbitrary javascript here. If you really need to run script (non-module) code, provides your own script via your addon's `/public` directory and either document that app authors should createa a `<script>` element in their HTML that includes it, or use `contentFor()` with one of the `type`s that appears in `index.html` to emit the scrip tag automatically. (`contentFor` targeting HTML is not deprecated, this deprecation only covers targeting javascript bundles.)
+
+#### vendor-suffix
+
+Returning content from an addon's `contentFor()` hook for `type="vendor-suffix"` is deprecated. Addons will no longer be allowed to inject arbitrary javascript here. If you really need to run script (non-module) code, provides your own script via your addon's `/public` directory and either document that app authors should createa a `<script>` element in their HTML that includes it, or use `contentFor()` with one of the `type`s that appears in `index.html` to emit the scrip tag automatically. (`contentFor` targeting HTML is not deprecated, this deprecation only covers targeting javascript bundles.)

content/ember-data/v4/ember-data-deprecate-string-arg-schemas.md

@@ -9,7 +9,7 @@ Deprecates `schema.attributesDefinitionFor(type)` and `schema.relationshipsDefin
 
 To resolve change:
 
-```diff
-- store.getSchemaDefinitionService().attributesDefinitionFor('user')
-+ store.getSchemaDefinitionService().attributesDefinitionFor({ type: 'user' })
+```js {data-diff="-1,+2"}
+store.getSchemaDefinitionService().attributesDefinitionFor('user')
+store.getSchemaDefinitionService().attributesDefinitionFor({ type: 'user' })
 ```

content/ember/v5/component-template-resolving.md

@@ -17,7 +17,7 @@ Specifically, these layouts are no longer supported:
 <table style="width:100%"><thead><tr><th>Classic</th><th>Pods</th></thead>
 <tbody><tr><td style="vertical-align:top; width:50%;">
 
-```
+```text
 {app,addon}/
   components/
     foo.js
@@ -32,7 +32,7 @@ Specifically, these layouts are no longer supported:
 
 </td><td style="vertical-align:top">
 
-```
+```text
 {app,addon}/
   components/
     foo/
@@ -50,7 +50,7 @@ Specifically, these layouts are no longer supported:
 
 The above example(s) can be migrated to:
 
-```
+```text
 {app,addon}/
   components/
     foo.js 
@@ -62,7 +62,7 @@ The above example(s) can be migrated to:
 
 Or using `--component-structure=nested`
 
-```
+```text
 {app,addon}/
   components/
     foo/