diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml index f2acad0be0..0a4860dc5f 100644 --- a/.github/workflows/chromatic.yml +++ b/.github/workflows/chromatic.yml @@ -37,7 +37,7 @@ jobs: run: pnpm install - name: 🧪 Run Chromatic Visual and Accessibility Tests - uses: chromaui/action@0794e6939fe40ce46a88963f818092afc427da5b # v15.3.0 + uses: chromaui/action@f191a0224b10e1a38b2091cefb7b7a2337009116 # v16.0.0 env: CHROMATIC_BRANCH: ${{ github.event.pull_request.head.ref || github.ref_name }} CHROMATIC_SHA: ${{ github.event.pull_request.head.sha || github.sha }} diff --git a/.github/workflows/welcome.yml b/.github/workflows/welcome-close.yml similarity index 98% rename from .github/workflows/welcome.yml rename to .github/workflows/welcome-close.yml index e4d0ec535a..606f691bc6 100644 --- a/.github/workflows/welcome.yml +++ b/.github/workflows/welcome-close.yml @@ -1,4 +1,4 @@ -name: welcome +name: Claim Contributor Message on: pull_request_target: diff --git a/.github/workflows/welcome-open.yml b/.github/workflows/welcome-open.yml new file mode 100644 index 0000000000..ccdb5f8cbd --- /dev/null +++ b/.github/workflows/welcome-open.yml @@ -0,0 +1,32 @@ +name: Welcome Message + +on: + pull_request_target: + branches: [main] + types: [opened] + +permissions: + pull-requests: write + +jobs: + greeting: + name: Greet First-Time Contributors + if: github.repository == 'npmx-dev/npmx.dev' + runs-on: ubuntu-latest + steps: + - uses: zephyrproject-rtos/action-first-interaction@58853996b1ac504b8e0f6964301f369d2bb22e5c + with: + repo-token: ${{ secrets.GITHUB_TOKEN }} + pr-opened-message: | + Hello! Thank you for opening your **first PR** to npmx, @${{ github.event.pull_request.user.login }}! 🚀 + + Here’s what will happen next: + + 1. Our GitHub bots will run to check your changes. + If they spot any issues you will see some error messages on this PR. + Don’t hesitate to ask any questions if you’re not sure what these mean! + + 2. In a few minutes, you’ll be able to see a preview of your changes on Vercel + + 3. One or more of our maintainers will take a look and may ask you to make changes. + We try to be responsive, but don’t worry if this takes a few days. diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index cc6afeb794..be2816ca6c 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -752,6 +752,23 @@ pnpm test:browser:ui # Run with Playwright UI Make sure to read about [Playwright best practices](https://playwright.dev/docs/best-practices) and don't rely on classes/IDs but try to follow user-replicable behaviour (like selecting an element based on text content instead). +#### Updating snapshots + +Some tests use image snapshots that must match the CI environment (Linux). If you need to update them, and aren't running Linux, you can use Docker to run in the same environment: + +```bash +docker run --rm \ + -e CI=true \ + -e NODE_OPTIONS="--max-old-space-size=4096" \ + -v $(pwd):/work \ + -w /work \ + mcr.microsoft.com/playwright:v1.58.2-noble \ + sh -c "npm install -g pnpm && pnpm install && pnpm vp run build:test && pnpm vp run test:browser:prebuilt --update-snapshots" +``` + +> [!NOTE] +> If the build runs out of memory, increase `--max-old-space-size` to `8192`. + ### Test fixtures (mocking external APIs) E2E tests use a fixture system to mock external API requests, ensuring tests are deterministic and don't hit real APIs. This is handled at two levels: diff --git a/app/assets/logos/sponsors/badrap-light.svg b/app/assets/logos/sponsors/badrap-light.svg new file mode 100644 index 0000000000..34773bbab4 --- /dev/null +++ b/app/assets/logos/sponsors/badrap-light.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/app/assets/logos/sponsors/badrap.svg b/app/assets/logos/sponsors/badrap.svg new file mode 100644 index 0000000000..d5c68ea86f --- /dev/null +++ b/app/assets/logos/sponsors/badrap.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/app/assets/logos/sponsors/chromatic-light.svg b/app/assets/logos/sponsors/chromatic-light.svg new file mode 100644 index 0000000000..1c92c46155 --- /dev/null +++ b/app/assets/logos/sponsors/chromatic-light.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/logos/sponsors/chromatic.svg b/app/assets/logos/sponsors/chromatic.svg new file mode 100644 index 0000000000..0ac4ecc5a9 --- /dev/null +++ b/app/assets/logos/sponsors/chromatic.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/app/assets/logos/sponsors/index.ts b/app/assets/logos/sponsors/index.ts index 3ab7d951ae..c7f64f2f5f 100644 --- a/app/assets/logos/sponsors/index.ts +++ b/app/assets/logos/sponsors/index.ts @@ -8,6 +8,10 @@ import LogoNetlify from './netlify.svg' import LogoNetlifyLight from './netlify-light.svg' import LogoBluesky from './bluesky.svg' import LogoBlueskyLight from './bluesky-light.svg' +import LogoBadrap from './badrap.svg' +import LogoBadrapLight from './badrap-light.svg' +import LogoChromatic from './chromatic.svg' +import LogoChromaticLight from './chromatic-light.svg' // The list is used on the about page. To add, simply upload the logos nearby and add an entry here. Prefer SVGs. // For logo src, specify a string or object with the light and dark theme variants. @@ -62,4 +66,22 @@ export const SPONSORS = [ normalisingIndent: '0.625rem', url: 'https://bsky.app/', }, + { + name: 'Chromatic', + logo: { + dark: LogoChromatic, + light: LogoChromaticLight, + }, + normalisingIndent: '0.5rem', + url: 'https://chromatic.com/', + }, + { + name: 'Badrap', + logo: { + dark: LogoBadrap, + light: LogoBadrapLight, + }, + normalisingIndent: '0.5rem', + url: 'https://badrap.io/', + }, ] diff --git a/app/components/AppFooter.vue b/app/components/AppFooter.vue index 6955352350..56bc9c8901 100644 --- a/app/components/AppFooter.vue +++ b/app/components/AppFooter.vue @@ -38,6 +38,9 @@ const closeModal = () => modalRef.value?.close?.() {{ $t('translation_status.title') }} + + {{ $t('footer.brand') }} +