Merge branch 'mdn:main' into main

.github/workflows/interfacedata-updater.yml

@@ -12,17 +12,17 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - name: Setup node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version-file: ".nvmrc"
-
       - name: Checkout content
         uses: actions/checkout@v3
         with:
           path: mdn-content
           ref: main
 
+      - name: Setup node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version-file: "mdn-content/.nvmrc"
+
       - name: Checkout webref
         uses: actions/checkout@v3
         with:

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

@@ -0,0 +1,156 @@
+name: Lint and review content files
+
+on:
+  pull_request_target:
+    branches:
+      - main
+    paths:
+      - .nvmrc
+      - "*.md"
+      - "files/**/*.md"
+
+permissions:
+  pull-requests: write
+
+concurrency:
+  group: ci-${{ github.workflow }}-${{ github.event.pull_request.number }}
+  cancel-in-progress: true
+
+jobs:
+  lint-and-review-docs:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout BASE
+        uses: actions/checkout@v3
+
+      - name: Get changed files
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          BASE_SHA: ${{ github.event.pull_request.base.sha }}
+          HEAD_SHA: ${{ github.event.pull_request.head.sha }}
+        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 }} \
+            --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)
+          echo "DIFF_DOCUMENTS=${DIFF_DOCUMENTS}" >> $GITHUB_ENV
+
+      - name: Checkout HEAD
+        if: ${{ env.DIFF_DOCUMENTS }}
+        uses: actions/checkout@v3
+        with:
+          ref: ${{ github.event.pull_request.head.sha }}
+          path: pr_head
+
+      - name: Get changed content from HEAD
+        if: ${{ env.DIFF_DOCUMENTS }}
+        run: |
+          git config --global user.email "[email protected]"
+          git config --global user.name "mdn-bot"
+
+          rm -r files *.md
+          mv pr_head/files pr_head/*.md .
+          rm -r pr_head
+
+          # To avoid contents of PR getting into the diff that we are going to generate
+          # after running the linters, here we make a dummy commit.
+          # Note, this commit is not getting pushed.
+          git add .
+          git commit -m "Code from PR head"
+
+      - name: Setup Node.js environment
+        if: ${{ env.DIFF_DOCUMENTS }}
+        uses: actions/setup-node@v3
+        with:
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install all yarn packages
+        if: ${{ env.DIFF_DOCUMENTS }}
+        run: yarn --frozen-lockfile
+        env:
+          # https://github.com/microsoft/vscode-ripgrep#github-api-limit-note
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Lint and format markdown files
+        if: ${{ env.DIFF_DOCUMENTS }}
+        run: |
+          # Generate random delimiter
+          # https://docs.github.com/en/actions/using-workflows/workflow-commands-for-github-actions#multiline-strings
+          EOF="$(openssl rand -hex 8)"
+
+          files_to_lint="${{ env.DIFF_DOCUMENTS }}"
+
+          echo "Running markdownlint --fix"
+          MD_LINT_FAILED=false
+          MD_LINT_LOG=$(yarn markdownlint-cli2 --fix ${files_to_lint} 2>&1) || MD_LINT_FAILED=true
+          echo "MD_LINT_LOG<<${EOF}" >> $GITHUB_ENV
+          echo "${MD_LINT_LOG}" >> $GITHUB_ENV
+          echo "${EOF}" >> $GITHUB_ENV
+          echo "MD_LINT_FAILED=${MD_LINT_FAILED}" >> $GITHUB_ENV
+
+          echo "Linting front-matter"
+          FM_LINT_FAILED=false
+          FM_LINT_LOG=$(node scripts/front-matter_linter.js --fix true ${files_to_lint} 2>&1) || FM_LINT_FAILED=true
+          echo "FM_LINT_LOG<<${EOF}" >> $GITHUB_ENV
+          echo "${FM_LINT_LOG}" >> $GITHUB_ENV
+          echo "${EOF}" >> $GITHUB_ENV
+          echo "FM_LINT_FAILED=${FM_LINT_FAILED}" >> $GITHUB_ENV
+
+          echo "Running Prettier"
+          yarn prettier -w ${files_to_lint}
+
+          if [[ -n $(git diff) ]]; then
+            echo "FILES_MODIFIED=true" >> $GITHUB_ENV
+          fi
+
+          # info for troubleshooting
+          echo MD_LINT_FAILED=${MD_LINT_FAILED}
+          echo FM_LINT_FAILED=${FM_LINT_FAILED}
+          git diff
+
+      - name: Setup reviewdog
+        if: env.FILES_MODIFIED == 'true' || env.MD_LINT_FAILED == 'true'
+        uses: reviewdog/action-setup@v1
+        with:
+          reviewdog_version: latest
+
+      - name: Suggest changes using diff
+        if: env.FILES_MODIFIED == 'true'
+        env:
+          REVIEWDOG_GITHUB_API_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          TMPFILE=$(mktemp)
+          git diff >"${TMPFILE}"
+          git stash -u && git stash drop
+          reviewdog \
+            -name="mdn-linter" \
+            -f=diff \
+            -f.diff.strip=1 \
+            -reporter=github-pr-review < "${TMPFILE}"
+
+      - name: Add reviews for markdownlint errors
+        if: env.MD_LINT_FAILED == 'true'
+        env:
+          REVIEWDOG_GITHUB_API_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          echo "${{ env.MD_LINT_LOG }}" | \
+            reviewdog \
+            -efm="%f:%l:%c %m" \
+            -efm="%f:%l %m" \
+            -name="markdownlint" \
+            -diff="git diff" \
+            -reporter="github-pr-review"
+
+      - name: Fail if any issues pending
+        if: env.FILES_MODIFIED == 'true' || env.MD_LINT_FAILED == 'true' || env.FM_LINT_FAILED == 'true'
+        run: |
+          echo -e "\nLogs from markdownlint:"
+          echo "${{ env.MD_LINT_LOG }}"
+          echo -e "\nLogs from front-matter linter:"
+          echo "${{ env.FM_LINT_LOG }}"
+          echo -e "\nPlease fix all the linting issues mentioned in above logs and in the review comments."
+          exit 1

.github/workflows/pr-test.yml

@@ -17,6 +17,11 @@ jobs:
     env:
       BASE_SHA: ${{ github.event.pull_request.base.sha }}
       HEAD_SHA: ${{ github.event.pull_request.head.sha }}
+      # This is the directory where the built files will be placed.
+      # It's also hardcoded in the `yarn build` command in package.json.
+      # If you change it here, you must also make the same change in
+      # package.json.
+      BUILD_OUT_ROOT: build
 
     steps:
       - uses: actions/checkout@v3
@@ -102,43 +107,31 @@ jobs:
           # package.json.
           yarn build ${{ env.GIT_DIFF_CONTENT }}
 
-          echo "Disk usage size of build/"
-          du -sh $BUILD_OUT_ROOT
+          echo "Disk usage size of the build"
+          du -sh ${{ env.BUILD_OUT_ROOT }}
 
           # Save the PR number into the build
-          echo ${{ github.event.number }} > build/NR
+          echo ${{ github.event.number }} > ${{ env.BUILD_OUT_ROOT }}/NR
 
-          # Download the raw diff blob and store that inside the ./build/
+          # 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 build/DIFF
+          wget https://github.com/${{ github.repository }}/compare/${{ env.BASE_SHA }}...${{ env.HEAD_SHA }}.diff -O ${{ env.BUILD_OUT_ROOT }}/DIFF
 
       - name: Merge static assets with built documents
         if: ${{ env.GIT_DIFF_CONTENT }}
         run: |
-          rsync -a node_modules/@mdn/yari/client/build/ build/
-
-          # Now that build/ directory contains everything you need to deploy
-          # that as a site. HTML, static assets, images, etc.
-          # However, that Yari static files is very heavy and it's in large
-          # part due to the .map files.
-          # In fact, as of March 2021, the client/build/static directory
-          # is 2.3MB but only 864KB without all the .map files.
-          # Let's delete those this time because this isn't the right time
-          # to debug JS or CSS.
-          echo "Before..."
-          du -sh build
-          find build/static -type f -name "*.map" | xargs ls -lh
-          find build/static -type f -name "*.map" | xargs rm
-          echo "After..."
-          du -sh build
+          # 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 }}
+          # Show the final disk usage size of the build.
+          du -sh ${{ env.BUILD_OUT_ROOT }}
 
       - uses: actions/upload-artifact@v3
         if: ${{ env.GIT_DIFF_CONTENT }}
         with:
           name: build
-          path: build/
+          path: ${{ env.BUILD_OUT_ROOT }}
 
       - name: Check changed files
         if: ${{ env.GIT_DIFF_FILES }}

.markdownlint-cli2.jsonc

@@ -106,7 +106,7 @@
     "no-bare-urls": false,
     // Produces too many false positives
     "no-space-in-emphasis": false,
-    "fenced-code-language": false,
+    "fenced-code-language": true,
     // See https://github.com/mdn/content/pull/20026, as macros currently break this
     "no-empty-links": false,
     "code-block-style": {

.nvmrc

@@ -1 +1 @@
-v18
+>=18.16.0

.vscode/cspell.json

@@ -0,0 +1,73 @@
+{
+  "$schema": "https://raw.githubusercontent.com/streetsidesoftware/cspell/main/cspell.schema.json",
+  "version": "0.2",
+  "language": "en-US",
+  "languageId": "*",
+  "dictionaries": [
+    "bash",
+    "css",
+    "cpp",
+    "django",
+    "filetypes",
+    "fonts",
+    "fullstack",
+    "html",
+    "latex",
+    "lorem-ipsum",
+    "markdown",
+    "node",
+    "npm",
+    "project-words",
+    "python",
+    "softwareTerms",
+    "svelte",
+    "typescript"
+  ],
+  "ignorePaths": [
+    ".vscode/cspell.json",
+    ".vscode/extensions.json",
+    ".markdownlint-cli2.jsonc"
+  ],
+  "ignoreRegExpList": [
+    // macros
+    "{{\\s?\\w*\\(",
+    "{{EmbedInteractiveExample\\(.*\\)}}",
+    "{{EmbedLiveSample\\(.*\\)}}",
+    "{{EmbedYouTube\\(\"[\\w-]*\"\\)}}",
+    // TODO - add some details what these match
+    "\\(#\\w*\\)",
+    "\\]\\(\\S*\\)",
+    "\\]\\(\\S*\\)",
+    "\\*\\*\\w\\*\\*\\w*",
+    "\\*\\w\\*\\w*",
+    "#[\\w-]*",
+    "aria-activedescendant=\"(?:[^\\\"]+|\\.)*\"",
+    "aria-controls=\"(?:[^\\\"]+|\\.)*\"",
+    "aria-describedby=\"(?:[^\\\"]+|\\.)*\"",
+    "aria-details=\"(?:[^\\\"]+|\\.)*\"",
+    "aria-errormessage=\"(?:[^\\\"]+|\\.)*\"",
+    "aria-flowto=\"(?:[^\\\"]+|\\.)*\"",
+    "aria-labelledby=\"(?:[^\\\"]+|\\.)*\"",
+    "aria-owns=\"(?:[^\\\"]+|\\.)*\"",
+    "Base64",
+    "class=\"(?:[^\\\"]+|\\.)*\"",
+    "data-test-id=\"(?:[^\\\"]+|\\.)*\"",
+    "EscapeCharacters",
+    "for=\"(?:[^\\\"]+|\\.)*\"",
+    "HexValues",
+    "href=\"(?:[^\\\"]+|\\.)*\"",
+    "id=\"(?:[^\\\"]+|\\.)*\"",
+    "lang=\".*\">.*</",
+    "src=\"(?:[^\\\"]+|\\.)*\"",
+    "url\\(\"data\\:image/svg\\+xml.*\"\\)[,;]",
+    "Urls"
+  ],
+  "allowCompoundWords": true,
+  "dictionaryDefinitions": [
+    {
+      "name": "project-words",
+      "path": "./project-words.txt",
+      "addWords": true
+    }
+  ]
+}

.vscode/extensions.json

@@ -1,6 +1,7 @@
 {
   "recommendations": [
-    "DavidAnson.vscode-markdownlint",
-    "esbenp.prettier-vscode"
+    "davidanson.vscode-markdownlint",
+    "esbenp.prettier-vscode",
+    "streetsidesoftware.code-spell-checker"
   ]
 }