Merge branch 'main' into manifest-sync-template

.github/workflows/auto-cleanup-bot.yml

@@ -34,7 +34,7 @@ jobs:
 
       - name: Create PR with only fixable issues
         if: success()
-        uses: peter-evans/create-pull-request@v6
+        uses: peter-evans/create-pull-request@v7
         with:
           commit-message: "chore: auto-fix Markdownlint, Prettier, and front-matter issues"
           branch: markdownlint-auto-cleanup
@@ -49,7 +49,7 @@ jobs:
 
       - name: Create PR with notice on unfixed issues
         if: failure()
-        uses: peter-evans/create-pull-request@v6
+        uses: peter-evans/create-pull-request@v7
         with:
           commit-message: "chore: auto-fix Markdownlint, Prettier, and front-matter issues"
           branch: markdownlint-auto-cleanup

.github/workflows/auto-merge.yml

@@ -6,7 +6,7 @@ on:
 jobs:
   auto-merge:
     runs-on: ubuntu-latest
-    if: github.actor == 'dependabot[bot]'
+    if: github.event.pull_request.user.login == 'dependabot[bot]'
     steps:
       - uses: ahmadnassri/[email protected]
         with:

.github/workflows/interfacedata-updater.yml

@@ -35,7 +35,7 @@ jobs:
         run: node scripts/update-interface-data.js ../webref/
 
       - name: Create pull request
-        uses: peter-evans/create-pull-request@v6
+        uses: peter-evans/create-pull-request@v7
         with:
           path: mdn-content
           token: ${{ secrets.AUTOMERGE_TOKEN }}

.github/workflows/pr-check-lint_content.yml

@@ -32,7 +32,7 @@ jobs:
         run: |
           # Use the GitHub API to get the list of changed files
           # documentation: https://docs.github.com/rest/commits/commits#compare-two-commits
-          DIFF_DOCUMENTS=$(gh api repos/{owner}/{repo}/compare/${{ env.BASE_SHA }}...${{ env.HEAD_SHA }} \
+          DIFF_DOCUMENTS=$(gh api repos/{owner}/{repo}/compare/${BASE_SHA}...${HEAD_SHA} \
             --jq '.files | .[] | select(.status|IN("added", "modified", "renamed", "copied", "changed")) | .filename')
           # filter out files that are not markdown
           DIFF_DOCUMENTS=$(echo "${DIFF_DOCUMENTS}" | egrep -i "^files/.*\.md$" | xargs)

.github/workflows/pr-test.yml

@@ -34,7 +34,7 @@ jobs:
         run: |
           # Use the GitHub API to get the list of changed files
           # documentation: https://docs.github.com/rest/commits/commits#compare-two-commits
-          DIFF_DOCUMENTS=$(gh api repos/{owner}/{repo}/compare/${{ env.BASE_SHA }}...${{ env.HEAD_SHA }} \
+          DIFF_DOCUMENTS=$(gh api repos/{owner}/{repo}/compare/${BASE_SHA}...${HEAD_SHA} \
             --jq '.files | .[] | select(.status|IN("added", "modified", "renamed", "copied", "changed")) | .filename')
 
           # filter out files that are not markdown files
@@ -97,27 +97,27 @@ jobs:
           # you don't need that script as a writer. It's only used in CI
           # and it can't use the default CONTENT_ROOT that gets set in
           # package.json.
-          yarn build ${{ env.GIT_DIFF_CONTENT }}
+          yarn build $GIT_DIFF_CONTENT
 
           echo "Disk usage size of the build"
-          du -sh ${{ env.BUILD_OUT_ROOT }}
+          du -sh $BUILD_OUT_ROOT
 
           # Save the PR number into the build
-          echo ${{ github.event.number }} > ${{ env.BUILD_OUT_ROOT }}/NR
+          echo ${{ github.event.number }} > ${BUILD_OUT_ROOT}/NR
 
           # Download the raw diff blob and store that inside the build
           # directory.
           # The purpose of this is for the PR Review Companion to later
           # be able to use this raw diff file for the benefit of analyzing.
-          wget https://github.com/${{ github.repository }}/compare/${{ env.BASE_SHA }}...${{ env.HEAD_SHA }}.diff -O ${{ env.BUILD_OUT_ROOT }}/DIFF
+          wget https://github.com/${{ github.repository }}/compare/${BASE_SHA}...${HEAD_SHA}.diff -O ${BUILD_OUT_ROOT}/DIFF
 
       - name: Merge static assets with built documents
         if: ${{ env.GIT_DIFF_CONTENT }}
         run: |
           # Exclude the .map files, as they're used for debugging JS and CSS.
-          rsync -a --exclude "*.map" node_modules/@mdn/yari/client/build/ ${{ env.BUILD_OUT_ROOT }}
+          rsync -a --exclude "*.map" node_modules/@mdn/yari/client/build/ $BUILD_OUT_ROOT
           # Show the final disk usage size of the build.
-          du -sh ${{ env.BUILD_OUT_ROOT }}
+          du -sh $BUILD_OUT_ROOT
 
       - uses: actions/upload-artifact@v4
         if: ${{ env.GIT_DIFF_CONTENT }}
@@ -128,7 +128,7 @@ jobs:
       - name: Check changed files
         if: ${{ env.GIT_DIFF_FILES }}
         run: |
-          echo ${{ env.GIT_DIFF_FILES }}
+          echo $GIT_DIFF_FILES
 
           export CONTENT_ROOT=$(pwd)/files
-          yarn filecheck ${{ env.GIT_DIFF_FILES }}
+          yarn filecheck $GIT_DIFF_FILES

.github/workflows/spelling-check-bot.yml

@@ -9,6 +9,8 @@ jobs:
   sync:
     if: github.repository == 'mdn/content'
     runs-on: ubuntu-latest
+    permissions:
+      issues: write
 
     steps:
       - uses: actions/checkout@v4
@@ -21,28 +23,32 @@ jobs:
 
       - name: Run scripts
         run: |
-          npm install
           echo Running spelling check...
           output=$(npx cspell --no-progress --gitignore --config .vscode/cspell.json "**/*.md" || exit 0)
-          echo "$output"
-          echo "OUTPUT<<EOF" >> $GITHUB_ENV
-          echo "$output" >> $GITHUB_ENV
-          echo "EOF" >> $GITHUB_ENV
-
-      - name: Create an issue
+          if [ -n "${output}" ]; then
+            output=$(node scripts/linkify-logs.js "${output}")
+            output=$(echo "$output" | sed 's/^/- /')
+            echo "$output"
+            echo "OUTPUT<<EOF" >> $GITHUB_ENV
+            echo "$output" >> $GITHUB_ENV
+            echo "EOF" >> $GITHUB_ENV
+          else
+            echo "No typos found! 🎉"
+          fi
+
+      - name: Report spellcheck errors
         if: env.OUTPUT != ''
-        uses: dacbd/create-issue-action@main
-        with:
-          token: ${{ secrets.GITHUB_TOKEN }}
-          title: Weekly spelling check
-          body: |
+        run: |
+          issue=$(gh issue create --title "$TITLE" --label "$LABELS" --body "$BODY")
+          echo Issue URL ${issue}
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          TITLE: Weekly spelling check
+          LABELS: reported by automation,good first issue
+          BODY: |
             Typos and unknown words:
 
-            ```
             ${{ env.OUTPUT }}
-            ```
 
             > [!TIP]
-            > To exclude words from the spellchecker, you can add valid words (web technology terms or abbreviations) to the [terms-abbreviations.txt](https://github.com/mdn/content/blob/main/.vscode/terms-abbreviations.txt) dictionary for IDE autocompletion. To ignore strings that are not words (`AABBCC` in code, for instance), you can add them to [ignore-list.txt](https://github.com/mdn/content/blob/main/.vscode/ignore-list.txt).
-        env:
-          OUTPUT: ${{ env.OUTPUT }}
+            > To exclude words from the spellchecker, you can add valid words (web technology terms or abbreviations) to the [terms-abbreviations.txt](https://github.com/mdn/content/blob/main/.vscode/terms-abbreviations.txt) dictionary for IDE autocompletion. To ignore strings that are not words (\`AABBCC\` in code, for instance), you can add them to [ignore-list.txt](https://github.com/mdn/content/blob/main/.vscode/ignore-list.txt).

.vscode/ignore-list.txt

@@ -1123,6 +1123,7 @@ Digi
 Digianswer
 dignissim
 Dijit
+dimoulis
 dinocons
 dinodescr
 Dinos
@@ -1663,6 +1664,7 @@ Freecodecamp
 Freemium
 Freetype
 Freitag
+Frida
 fringilla
 fringille
 fromcharcode
@@ -2368,6 +2370,7 @@ JXON
 Kadir
 Kadlec
 kaios
+Kahlo
 Kakao
 Kaku
 Kaply

files/en-us/_redirects.txt

@@ -844,7 +844,7 @@
 /en-US/docs/CSS/transition-property	/en-US/docs/Web/CSS/transition-property
 /en-US/docs/CSS/transition-timing-function	/en-US/docs/Web/CSS/transition-timing-function
 /en-US/docs/CSS/unicode-bidi	/en-US/docs/Web/CSS/unicode-bidi
-/en-US/docs/CSS/uri	/en-US/docs/Web/CSS/url
+/en-US/docs/CSS/uri	/en-US/docs/Web/CSS/url_value
 /en-US/docs/CSS/used_value	/en-US/docs/Web/CSS/used_value
 /en-US/docs/CSS/user-ident	/en-US/docs/Web/CSS/custom-ident
 /en-US/docs/CSS/user-select	/en-US/docs/Web/CSS/user-select
@@ -1085,7 +1085,7 @@
 /en-US/docs/CSS:text-shadow	/en-US/docs/Web/CSS/text-shadow
 /en-US/docs/CSS:text-transform	/en-US/docs/Web/CSS/text-transform
 /en-US/docs/CSS:top	/en-US/docs/Web/CSS/top
-/en-US/docs/CSS:uri	/en-US/docs/Web/CSS/url
+/en-US/docs/CSS:uri	/en-US/docs/Web/CSS/url_value
 /en-US/docs/CSS:vertical-align	/en-US/docs/Web/CSS/vertical-align
 /en-US/docs/CSS:visibility	/en-US/docs/Web/CSS/visibility
 /en-US/docs/CSS:visible	/en-US/docs/Web/CSS/visibility
@@ -11623,7 +11623,7 @@
 /en-US/docs/Web/CSS/filter-function/path()	/en-US/docs/Web/CSS/basic-shape/path
 /en-US/docs/Web/CSS/filter-function/saturate()	/en-US/docs/Web/CSS/filter-function/saturate
 /en-US/docs/Web/CSS/filter-function/sepia()	/en-US/docs/Web/CSS/filter-function/sepia
-/en-US/docs/Web/CSS/filter-function/url	/en-US/docs/Web/CSS/url
+/en-US/docs/Web/CSS/filter-function/url	/en-US/docs/Web/CSS/url_value
 /en-US/docs/Web/CSS/fit-content()	/en-US/docs/Web/CSS/fit-content_function
 /en-US/docs/Web/CSS/flex-align	/en-US/docs/Web/CSS/align-items
 /en-US/docs/Web/CSS/flex-item-align	/en-US/docs/Web/CSS/align-self
@@ -11660,6 +11660,7 @@
 /en-US/docs/Web/CSS/linear-gradient()	/en-US/docs/Web/CSS/gradient/linear-gradient
 /en-US/docs/Web/CSS/margin-new	/en-US/docs/Web/CSS/margin
 /en-US/docs/Web/CSS/margin_collapsing	/en-US/docs/Web/CSS/CSS_box_model/Mastering_margin_collapsing
+/en-US/docs/Web/CSS/masonry-auto-flow	/en-US/docs/Web/CSS/grid-auto-flow
 /en-US/docs/Web/CSS/max()	/en-US/docs/Web/CSS/max
 /en-US/docs/Web/CSS/media	/en-US/docs/Web/CSS/@media
 /en-US/docs/Web/CSS/media/Bitmap	/en-US/docs/Web/CSS/@media
@@ -11737,8 +11738,9 @@
 /en-US/docs/Web/CSS/transform-function/translateY()	/en-US/docs/Web/CSS/transform-function/translateY
 /en-US/docs/Web/CSS/transform-function/translateZ()	/en-US/docs/Web/CSS/transform-function/translateZ
 /en-US/docs/Web/CSS/unicode-range	/en-US/docs/Web/CSS/@font-face/unicode-range
-/en-US/docs/Web/CSS/uri	/en-US/docs/Web/CSS/url
-/en-US/docs/Web/CSS/url()	/en-US/docs/Web/CSS/url
+/en-US/docs/Web/CSS/uri	/en-US/docs/Web/CSS/url_value
+/en-US/docs/Web/CSS/url	/en-US/docs/Web/CSS/url_value
+/en-US/docs/Web/CSS/url()	/en-US/docs/Web/CSS/url_function
 /en-US/docs/Web/CSS/user-ident	/en-US/docs/Web/CSS/custom-ident
 /en-US/docs/Web/CSS/var()	/en-US/docs/Web/CSS/var
 /en-US/docs/Web/CSS/visible	/en-US/docs/Web/CSS/visibility

files/en-us/_wikihistory.json

@@ -86802,10 +86802,6 @@
       "Heycam"
     ]
   },
-  "Web/CSS/masonry-auto-flow": {
-    "modified": "2020-11-12T04:50:46.255Z",
-    "contributors": ["rachelandrew", "chrisdavidmills"]
-  },
   "Web/CSS/math-style": {
     "modified": "2020-12-12T22:36:34.292Z",
     "contributors": ["sideshowbarker", "chrisdavidmills", "rachelandrew"]
@@ -90642,7 +90638,7 @@
       "teoli"
     ]
   },
-  "Web/CSS/url": {
+  "Web/CSS/url_value": {
     "modified": "2020-12-11T11:18:33.507Z",
     "contributors": [
       "rachelandrew",

files/en-us/games/publishing_games/game_distribution/index.md

@@ -56,7 +56,7 @@ If you're working on a side project just for fun, then leaving the source open w
 
 As the name may suggest, publishers can handle the publishing of your game for you. Whether you should go that way or not depends on what your plan is for having your game distributed: Do you want to send it wherever possible, or do you want to restrict its presence to those who've bought an [exclusive license](/en-US/docs/Games/Publishing_games/Game_monetization)? It's up to you. Consider various options, experiment and conclude. Publishers will be explained in more detail in the [monetization](/en-US/docs/Games/Publishing_games/Game_monetization) article.
 
-There are also independent portals collecting interesting games like [HTML5Games.com](https://html5games.com/), [GameArter.com](https://www.gamearter.com/), [MarketJS.com](https://www.marketjs.com/), [GameFlare](https://distribution.gameflare.com/), [GameDistribution.com](https://gamedistribution.com/), [Poki](https://developers.poki.com/), or [CrazyGames](https://developer.crazygames.com/) where you can send your game in and it will get some natural promotion because of the big traffic those sites attract. Some of these take your files and host them on their server, whereas others only link to your website or embed your game on their site. Such exposure may just provide [promotion](/en-US/docs/Games/Publishing_games/Game_promotion) for your game, or if you have adverts shown beside your game (or other money making options) it may also provide monetization.
+There are also independent portals collecting interesting games like [HTML5Games.com](https://html5games.com/), [GameArter.com](https://www.gamearter.com/), [MarketJS.com](https://www.marketjs.com/), [GameFlare](https://distribution.gameflare.com/), [GameDistribution.com](https://gamedistribution.com/), [GameSaturn.com](https://gamesaturn.com/), [Poki](https://developers.poki.com/), or [CrazyGames](https://developer.crazygames.com/) where you can send your game in and it will get some natural promotion because of the big traffic those sites attract. Some of these take your files and host them on their server, whereas others only link to your website or embed your game on their site. Such exposure may just provide [promotion](/en-US/docs/Games/Publishing_games/Game_promotion) for your game, or if you have adverts shown beside your game (or other money making options) it may also provide monetization.
 
 ### Web and native stores
 

files/en-us/games/techniques/3d_on_the_web/building_up_a_basic_demo_with_three.js/index.md

@@ -15,7 +15,7 @@ A typical 3D scene in a game — even the simplest one — contains standard ite
 
 To start developing with Three.js, you should make sure you are using a modern browser with good [WebGL](/en-US/docs/Web/API/WebGL_API) support, such as the latest Firefox or Chrome.
 
-You can download the [latest Three.js library](https://github.com/mrdoob/three.js/archive/master.zip) and copy the minified version of Three.js from the uncompressed archive at `build/three.module.min.js` into your project.
+You can download the [latest Three.js library](https://codeload.github.com/mrdoob/three.js/zip/refs/heads/master) and copy the minified version of Three.js from the uncompressed archive at `build/three.module.min.js` into your project.
 Bear in mind that the archives include source files, which makes the download size approximately 350MB.
 
 Alternatively, you can import Three.js [using a CDN or use Node.js](https://threejs.org/docs/#manual/en/introduction/Installation).

files/en-us/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.md

@@ -132,7 +132,7 @@ ctx.closePath();
 
 ctx.beginPath();
 ctx.rect(160, 10, 100, 40);
-ctx.strokeStyle = "rgba(0, 0, 255, 0.5)";
+ctx.strokeStyle = "rgb(0 0 255 / 0.5)";
 ctx.stroke();
 ctx.closePath();
 ```

files/en-us/glossary/css_preprocessor/index.md

@@ -19,7 +19,6 @@ To use a CSS preprocessor, you must install a CSS compiler on your web {{Glossar
   - [Sass](https://sass-lang.com/)
   - [LESS](https://lesscss.org/)
   - [Stylus](https://stylus-lang.com/)
-  - [PostCSS](https://postcss.org/)
 
 - Related glossary terms:
   - {{Glossary("CSS")}}

files/en-us/glossary/statement/index.md

@@ -10,5 +10,5 @@ In a computer programming language, a **statement** is a line of code commanding
 
 ## See also
 
-- [Statement (computer science)](<https://en.wikipedia.org/wiki/Statement_(computer_science)>) on Wikipedia
 - [JavaScript statements and declarations](/en-US/docs/Web/JavaScript/Reference/Statements)
+- [Statement (computer science)](<https://en.wikipedia.org/wiki/Statement_(computer_science)>) on Wikipedia

files/en-us/glossary/throttle/index.md

@@ -10,7 +10,7 @@ page-type: glossary-definition
 
 Throttling is very similar to {{glossary("debounce", "debouncing")}}. The key difference is that when invocations happen continuously, throttling ensures that the operation is still performed at a certain maximum rate, while debouncing waits indefinitely until the invocations stop for a certain amount of time.
 
-A typical use case of debouncing is when synchronizing with another constantly-updating state. Consider a function `onScrolled`, which listens for the [`scroll`](/en-US/docs/Web/API/Document/scroll_event) event. The `scroll` event may fire as often as every pixel scrolled, so the function will be called in very short intervals. If `onScrolled` is computationally expensive, earlier invocations might block later invocations from happening on time, or block other things from executing in the meantime, leading to a noticeable {{glossary("jank")}}. In this case, we can throttle `onScrolled`, such that it can only be called at most once every 10 milliseconds:
+A typical use case of throttling is when synchronizing with another constantly-updating state. Consider a function `onScrolled`, which listens for the [`scroll`](/en-US/docs/Web/API/Document/scroll_event) event. The `scroll` event may fire as often as every pixel scrolled, so the function will be called in very short intervals. If `onScrolled` is computationally expensive, earlier invocations might block later invocations from happening on time, or block other things from executing in the meantime, leading to a noticeable {{glossary("jank")}}. In this case, we can throttle `onScrolled`, such that it can only be called at most once every 10 milliseconds:
 
 1. The first call to `onScrolled` is known as the _leading edge_.
 2. For every next call to `onScrolled`, if it is within 10 milliseconds from the first call, it is in the same "batch" as the first call.