-
Notifications
You must be signed in to change notification settings - Fork 32
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
81 changed files
with
2,754 additions
and
746 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,118 @@ | ||
| name: visual-regression | ||
|
|
||
| on: | ||
| push: | ||
| branches: | ||
| - '**' | ||
| - '!**--skip-ci' | ||
| - '!**--visual-reports' | ||
| - '!wip/**' | ||
| - '!experiments/**' | ||
| - '!release' | ||
| - '!portal' | ||
| - '!beta' | ||
| - '!alpha' | ||
| pull_request: | ||
| branches: | ||
| - 'main' | ||
| types: [opened] | ||
|
|
||
| concurrency: | ||
| group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }} | ||
| cancel-in-progress: true | ||
|
|
||
| env: | ||
| GH_EMAIL: ${{ secrets.GH_EMAIL }} | ||
| GH_NAME: ${{ secrets.GH_NAME }} | ||
| GH_TOKEN: ${{ secrets.GH_TOKEN }} | ||
| NPM_TOKEN: ${{ secrets.NPM_TOKEN }} | ||
| FIGMA_TOKEN: ${{ secrets.FIGMA_TOKEN }} | ||
| FIGMA_ICONS_FILE: ${{ secrets.FIGMA_ICONS_FILE }} | ||
| ALGOLIA_APP_ID: ${{ secrets.ALGOLIA_APP_ID }} | ||
| ALGOLIA_INDEX_NAME: ${{ secrets.ALGOLIA_INDEX_NAME }} | ||
| ALGOLIA_SEARCH_KEY: ${{ secrets.ALGOLIA_SEARCH_KEY }} | ||
| ALGOLIA_API_KEY: ${{ secrets.ALGOLIA_API_KEY }} | ||
| RUN_POST_BUILD: ${{ startsWith(github.ref, 'refs/heads/main') || startsWith(github.ref, 'refs/heads/v') }} | ||
|
|
||
| jobs: | ||
| visual-regression: | ||
| name: Run visual-regression tests | ||
|
|
||
| runs-on: macos-15 | ||
|
|
||
| timeout-minutes: 40 | ||
|
|
||
| steps: | ||
| - name: Git checkout | ||
| uses: actions/checkout@v4 | ||
| with: | ||
| persist-credentials: false | ||
|
|
||
| - name: Use Node.js | ||
| uses: actions/setup-node@v4 | ||
| with: | ||
| node-version-file: 'package.json' | ||
|
|
||
| - name: Use yarn cache | ||
| uses: actions/cache@v4 | ||
| id: yarn-cache | ||
| with: | ||
| path: ./.yarn/cache | ||
| key: ${{ secrets.CACHE_VERSION }}-${{ runner.os }}-deps-${{ hashFiles('**/yarn.lock') }} | ||
| restore-keys: ${{ secrets.CACHE_VERSION }}-${{ runner.os }}-deps- | ||
|
|
||
| - name: Install dependencies | ||
| run: yarn install --immutable | ||
|
|
||
| - name: Use Playwright cache | ||
| uses: actions/cache@v4 | ||
| id: playwright-cache | ||
| with: | ||
| path: | | ||
| ~/Library/Caches/ms-playwright | ||
| ~/.cache/ms-playwright | ||
| %USERPROFILE%\AppData\Local\ms-playwright | ||
| key: ${{ secrets.CACHE_VERSION }}-${{ runner.os }}-playwright-${{ hashFiles('**/yarn.lock') }} | ||
| - run: yarn workspace @dnb/eufemia playwright install --with-deps firefox | ||
| if: steps.playwright-cache.outputs.cache-hit != 'true' | ||
| - run: yarn workspace @dnb/eufemia playwright install-deps firefox | ||
| if: steps.playwright-cache.outputs.cache-hit == 'true' | ||
|
|
||
| - name: Prebuild Library | ||
| if: env.RUN_POST_BUILD == 'true' | ||
| run: yarn workspace @dnb/eufemia prebuild:ci | ||
|
|
||
| - name: Postbuild Library | ||
| if: env.RUN_POST_BUILD == 'true' | ||
| run: yarn workspace @dnb/eufemia postbuild:ci | ||
|
|
||
| - name: Build portal | ||
| run: yarn workspace dnb-design-system-portal build:visual-test | ||
|
|
||
| - name: Run visual tests | ||
| run: yarn workspace dnb-design-system-portal test:screenshots:ci | ||
|
|
||
| - uses: actions/upload-artifact@v4 | ||
| if: failure() | ||
| with: | ||
| name: visual-test-artifact | ||
| path: | | ||
| ./packages/dnb-eufemia/src/**/*.snap-diff.png | ||
| ./packages/dnb-eufemia/jest-visual-diff-report/* | ||
| - name: Run visual tests info | ||
| if: failure() | ||
| run: echo '\n\n👉 Download the diff files as a ZIP file. \nIt is called "visual-test-artifact" and you find it in the test "Summary" under "Artifacts".\n\n\n' | ||
|
|
||
| - name: Slack | ||
| uses: 8398a7/action-slack@v3 | ||
| with: | ||
| channel: '#eufemia-dev' | ||
| status: ${{ job.status }} | ||
| fields: author,ref,workflow,job,took | ||
| job_name: Run visual regression tests | ||
| github_base_url: https://github.com/ | ||
| env: | ||
| SLACK_WEBHOOK_URL: ${{ secrets.SLACK_WEBHOOK }} | ||
| if: ${{ always() && !github.event.pull_request.head.repo.fork }} | ||
| continue-on-error: true |
23 changes: 23 additions & 0 deletions
23
...nb-design-system-portal/src/docs/uilib/extensions/forms/Form/useTranslation.mdx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| --- | ||
| title: 'useTranslation' | ||
| description: '`Form.useTranslation` is a hook that returns the translations for the current locale.' | ||
| showTabs: true | ||
| tabs: | ||
| - title: Info | ||
| key: '/info' | ||
| - title: Demos | ||
| key: '/demos' | ||
| breadcrumb: | ||
| - text: Forms | ||
| href: /uilib/extensions/forms/ | ||
| - text: Form | ||
| href: /uilib/extensions/forms/Form/ | ||
| - text: Form.useTranslation | ||
| href: /uilib/extensions/forms/Form/useTranslation/ | ||
| --- | ||
|
|
||
| import Info from 'Docs/uilib/extensions/forms/Form/useTranslation/info' | ||
| import Demos from 'Docs/uilib/extensions/forms/Form/useTranslation/demos' | ||
|
|
||
| <Info /> | ||
| <Demos /> |
78 changes: 78 additions & 0 deletions
78
...dnb-design-system-portal/src/docs/uilib/extensions/forms/Form/useTranslation/Examples.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,78 @@ | ||
| /* eslint-disable @typescript-eslint/ban-ts-comment */ | ||
| // @ts-nocheck | ||
| import React from 'react' | ||
| import ComponentBox from '../../../../../../shared/tags/ComponentBox' | ||
| import { Form } from '@dnb/eufemia/src/extensions/forms' | ||
|
|
||
| export const CustomTranslations = () => { | ||
| return ( | ||
| <ComponentBox> | ||
| {() => { | ||
| const MyField = () => { | ||
| const { Custom, formatMessage } = Form.useTranslation() | ||
|
|
||
| const myTranslation = formatMessage(Custom.translation, { | ||
| myKey: 'value!', | ||
| }) | ||
| console.log('Custom', myTranslation) | ||
|
|
||
| return <>{myTranslation}</> | ||
| } | ||
|
|
||
| const MyForm = () => { | ||
| return ( | ||
| <Form.Handler | ||
| locale="en-GB" | ||
| translations={{ | ||
| 'en-GB': { | ||
| Custom: { translation: 'My translation with a {myKey}' }, | ||
| }, | ||
| }} | ||
| > | ||
| <MyField /> | ||
| </Form.Handler> | ||
| ) | ||
| } | ||
|
|
||
| return <MyForm /> | ||
| }} | ||
| </ComponentBox> | ||
| ) | ||
| } | ||
|
|
||
| export const GetTranslation = () => { | ||
| return ( | ||
| <ComponentBox> | ||
| {() => { | ||
| const MyField = () => { | ||
| const { formatMessage } = Form.useTranslation() | ||
|
|
||
| const myTranslation = formatMessage('Custom.translation', { | ||
| myKey: 'value!', | ||
| }) | ||
| const errorRequired = formatMessage('Field.errorRequired') | ||
| console.log(errorRequired) | ||
|
|
||
| return <>{myTranslation}</> | ||
| } | ||
|
|
||
| const MyForm = () => { | ||
| return ( | ||
| <Form.Handler | ||
| locale="en-GB" | ||
| translations={{ | ||
| 'en-GB': { | ||
| Custom: { translation: 'My translation with a {myKey}' }, | ||
| }, | ||
| }} | ||
| > | ||
| <MyField /> | ||
| </Form.Handler> | ||
| ) | ||
| } | ||
|
|
||
| return <MyForm /> | ||
| }} | ||
| </ComponentBox> | ||
| ) | ||
| } |
15 changes: 15 additions & 0 deletions
15
...ign-system-portal/src/docs/uilib/extensions/forms/Form/useTranslation/demos.mdx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| --- | ||
| showTabs: true | ||
| --- | ||
|
|
||
| import * as Examples from './Examples' | ||
|
|
||
| ## Demos | ||
|
|
||
| ### Custom translations example | ||
|
|
||
| <Examples.CustomTranslations /> | ||
|
|
||
| ### Get translations with a key | ||
|
|
||
| <Examples.GetTranslation /> |
Oops, something went wrong.