Skip to content

Commit 332698f

Browse files
KocalKocal
committed
Merge branch '2.x' into 3.x
* 2.x: [Toolkit] Delay/hide the "Community Kits" feature, minor fixes [Site] Fix port to 9044 and upgrade UX dependencies [Docs] Fix `composer config` to avoid modifying `package.json` automatically Refactor "test_package.sh" to its original purpose, add multiples checks for packages definition Enhance PR template with deprecation and documentation fields [Icons] explain svg colors and improve example configuration [Docs] Add doc for E2E steps + minor modifications [Site] Lock icons
2 parents d30a7d4 + d20f2c0 commit 332698f

File tree

82 files changed

+1035
-1457
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

82 files changed

+1035
-1457
lines changed

‎.github/PULL_REQUEST_TEMPLATE.md‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
1-
| Q | A
2-
| ------------- | ---
3-
| Bug fix? | yes/no
4-
| New feature? | yes/no <!-- please update src/**/CHANGELOG.md files -->
5-
| Docs? | yes/no <!-- required for new features -->
6-
| Issues | Fix #... <!-- prefix each issue number with "Fix #", no need to create an issue if none exist, explain below instead -->
7-
| License | MIT
1+
| Q | A
2+
| -------------- | ---
3+
| Bug fix? | yes/no
4+
| New feature? | yes/no <!-- please update src/**/CHANGELOG.md files -->
5+
| Deprecations? | yes/no <!-- if yes, also update UPGRADE-*.md and src/**/CHANGELOG.md -->
6+
| Documentation? | yes/no <!-- required for new features, or documentation updates -->
7+
| Issues | Fix #... <!-- prefix each issue number with "Fix #", no need to create an issue if none exist, explain below instead -->
8+
| License | MIT
89

910
<!--
1011
Replace this notice by a description of your feature/bugfix.

‎.github/workflows/code-quality.yaml‎

Lines changed: 109 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,114 @@ concurrency:
1919
cancel-in-progress: true
2020

2121
jobs:
22+
validate-packages:
23+
name: Validate packages definition
24+
runs-on: ubuntu-latest
25+
steps:
26+
- uses: actions/checkout@v4
27+
28+
- name: Check all composer.json have label "symfony-ux"
29+
if: always()
30+
run: |
31+
for file in $(find src/ -mindepth 2 -type f -name composer.json); do
32+
if ! jq -e '.keywords | index("symfony-ux")' "$file" > /dev/null; then
33+
echo "File $file does not have the keyword 'symfony-ux' in its composer.json";
34+
exit 1;
35+
fi
36+
done
37+
38+
- name: Check all composer.json have license "MIT"
39+
if: always()
40+
run: |
41+
for file in $(find src/ -mindepth 2 -type f -name composer.json); do
42+
if ! jq -e '.license == "MIT"' "$file" > /dev/null; then
43+
echo "File $file does not have the license 'MIT' in its composer.json";
44+
exit 1;
45+
fi
46+
done
47+
48+
- name: Check all composer.json have minimum-stability "dev"
49+
if: always()
50+
run: |
51+
for file in $(find src/ -mindepth 2 -type f -name composer.json); do
52+
if ! jq -e '."minimum-stability" == "dev"' "$file" > /dev/null; then
53+
echo "File $file does not have the minimum-stability 'dev' in its composer.json";
54+
exit 1;
55+
fi
56+
done
57+
58+
- name: Check all composer.json have dependency to "php" >=8.1
59+
if: always()
60+
run: |
61+
for file in $(find src/ -mindepth 2 -type f -name composer.json); do
62+
if ! jq -e '.require.php | test(">=8.1")' "$file" > /dev/null; then
63+
echo "File $file does not have the dependency 'php' >=8.1 in its composer.json";
64+
exit 1;
65+
fi
66+
done
67+
68+
- name: Check all package.json have license "MIT"
69+
if: always()
70+
run: |
71+
for file in $(find src/ -mindepth 2 -type f -name package.json -not -path "*/tests/*"); do
72+
if ! jq -e '.license == "MIT"' "$file" > /dev/null; then
73+
echo "File $file does not have the license 'MIT' in its package.json";
74+
exit 1;
75+
fi
76+
done
77+
78+
- name: Check all package.json have keywords including "symfony-ux"
79+
if: always()
80+
run: |
81+
for file in $(find src/ -mindepth 2 -type f -name package.json -not -path "*/tests/*"); do
82+
if ! jq -e '.keywords | index("symfony-ux")' "$file" > /dev/null; then
83+
echo "File $file does not have the keyword 'symfony-ux' in its package.json";
84+
exit 1;
85+
fi
86+
done
87+
88+
89+
- name: Check all package.json have type "module"
90+
if: always()
91+
run: |
92+
for file in $(find src/ -mindepth 2 -type f -name package.json -not -path "*/tests/*"); do
93+
if ! jq -e '.type == "module"' "$file" > /dev/null; then
94+
echo "File $file does not have the type 'module' in its package.json";
95+
exit 1;
96+
fi
97+
done
98+
99+
- name: Check all package.json have files '["dist"]'
100+
if: always()
101+
run: |
102+
for file in $(find src/ -mindepth 2 -type f -name package.json -not -path "*/tests/*"); do
103+
if ! jq -e '.files | index("dist")' "$file" > /dev/null; then
104+
echo "File $file does not have the files 'dist' in its package.json";
105+
exit 1;
106+
fi
107+
done
108+
109+
- name: Check all package.json peerDependencies are present in devDependencies and importmap to the exact same version
110+
if: always()
111+
run: |
112+
for file in $(find src/ -mindepth 2 -type f -name package.json -not -path "*/tests/*"); do
113+
peerDependencies=$(jq -r '.peerDependencies | keys[]' "$file")
114+
for peerDependency in $peerDependencies; do
115+
peerDependencyVersion=$(jq -r --arg dep "$peerDependency" '.peerDependencies[$dep]' "$file")
116+
importmapVersion=$(jq -r ".symfony.importmap.\"$peerDependency\" | if type == \"string\" then . else .version end" "$file")
117+
118+
if [ "$importmapVersion" == null ]; then
119+
echo "File $file does not have the peerDependency '$peerDependency' in its symfony.importmap, skipping version check";
120+
continue
121+
fi
122+
123+
if [ "$peerDependencyVersion" != "$importmapVersion" ]; then
124+
echo "File $file has a mismatch for $peerDependency: peerDependency version is '$peerDependencyVersion' but symfony.importmap version is '$importmapVersion'";
125+
exit 1;
126+
fi
127+
done
128+
done
129+
22130
coding-style-js:
23131
name: JavaScript Coding Style
24132
runs-on: ubuntu-latest
@@ -68,7 +176,7 @@ jobs:
68176
69177
# TODO: Only Turbo has PHPStan configuration, let's improve this later :)
70178
PACKAGES=Turbo
71-
#PACKAGES=$(find src/ -mindepth 2 -type f -name composer.json -not -path "*/vendor/*" -printf '%h\n' | sed 's/^src\///' | sort | tr '\n' ' ')
179+
#PACKAGES=$(find src/ -mindepth 2 -type f -name composer.json -printf '%h\n' | sed 's/^src\///' | sort | tr '\n' ' ')
72180
echo "Packages: $PACKAGES"
73181
echo "PACKAGES=$PACKAGES" >> $GITHUB_ENV
74182

‎CONTRIBUTING.md‎

Lines changed: 48 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -83,18 +83,64 @@ To help you with assets, you can run the following commands in a specific packag
8383
- `pnpm run watch`: watch for modifications and rebuild assets from the package,
8484
- `pnpm run test`: run the tests from the package,
8585
- `pnpm run test:unit`: run the Unit tests from the package,
86-
- `pnpm run test:browser`: run the Browser tests from the package,
86+
- `pnpm run test:browser`: run the Browser tests from the package, in a headless browser
87+
- `pnpm run test:browser:ui`: run the Browser tests from the package in interactive mode, allowing you to see the tests running in a browser window and debug them if needed
8788
- `pnpm run check`: run the formatter, linter, and sort imports, and fails if any modifications
8889
- `pnpm run check --write`: run the formatter, linter, imports sorting, and write modifications
8990

9091
Thanks to [PNPM Workspaces](https://pnpm.io/workspaces), you can also run these commands from the root directory of the project:
9192
- `pnpm run build`: build (compile) assets from **all** packages,
9293
- `pnpm run test`: run the tests from **all** packages,
9394
- `pnpm run test:unit`: run the Unit tests from **all** packages,
94-
- `pnpm run test:browser`: run the Browser tests from **all** packages,
95+
- `pnpm run test:browser`: run the Browser tests from **all** packages, in a headless browser
9596
- `pnpm run check`: run the formatter, linter, and sort imports for **all** packages, and fails if any modifications
9697
- `pnpm run check --write`: run the formatter, linter, imports sorting for **all** packages, and write modifications
9798

99+
#### Working with Unit tests
100+
101+
We use [Vitest](https://vitest.dev/) for unit testing of the assets,
102+
and tests files are located in the `assets/test/unit/` directory of each UX package,
103+
for example: `src/Vue/assets/test/unit/render_controller.test.ts`.
104+
105+
**Running tests:**
106+
- At the project's root, you can run the following commands:
107+
- `pnpm run test:unit`: runs the unit tests for **all** UX packages
108+
- Inside the `assets/` directory of each UX package, you can run the following commands:
109+
- `pnpm run test:unit`: runs the unit tests for the package
110+
111+
> [!IMPORTANT]
112+
> The command `pnpm run test:unit` ensure that each possible combination of dependencies is tested
113+
> (e.g., `"chart.js": "^3.4.1 || ^4.0"` for UX Chartjs).
114+
> Thus it may take some time to run, and it may be not recommended to use watch mode.
115+
116+
#### Working with End-to-End (E2E) tests
117+
118+
> [!NOTE]
119+
> E2E tests simulate real user interactions in a browser, to ensure that the
120+
> UX packages work as expected in a real-world scenario.
121+
122+
Symfony UX use [Playwright](https://playwright.dev/) for browser automation and testing,
123+
and a dedicated Symfony application located in the [`apps/e2e/`](./apps/e2e/) directory,
124+
which contains many examples of Symfony UX packages usage.
125+
126+
Tests files are located in the `assets/test/browser/` directory of each UX package,
127+
for example: `src/Vue/assets/test/browser/vue.test.ts`.
128+
129+
**Setup:**
130+
1. Ensure to have followed the steps in the [Setting up the development environment](#setting-up-the-development-environment) section
131+
2. Read and follow the instructions in the [`apps/e2e/README.md`](./apps/e2e/README.md) file,
132+
133+
**Running tests:**
134+
- At the project's root, you can run the following commands:
135+
- `pnpm run test:browser`: runs the browser tests for **all** UX packages, using a headless browser
136+
- Inside the `assets/` directory of each UX package, you can run the following commands:
137+
- `pnpm run test:browser`: runs browser tests for the package, using a headless browser
138+
- `pnpm run test:browser:ui`: runs the browser tests in interactive mode, allowing you to see the tests running in a browser window and debug them if needed
139+
140+
> [!IMPORTANT]
141+
> Due to their nature, E2E tests may be slower to run than unit tests.
142+
> During the development, we recommend to run `pnpm run test:browser` or `pnpm run test:browser:ui` for a specific UX package.
143+
98144
### Working on documentation
99145

100146
Symfony UX documentation is written in ReStructuredText (`.rst`) and is located in the `docs/` directory

‎bin/test_package.sh‎ renamed to ‎bin/unit_test_package.sh‎

Lines changed: 4 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
#!/bin/bash
22

3-
# This script is used to test an UX package.
3+
# This script is used to unit test assets from an UX package.
44
# It also handle the case where a package has multiple versions of a peerDependency defined.
55

66
SCRIPT_DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" &> /dev/null && pwd )"
@@ -21,13 +21,6 @@ if [ ! -d "$location" ]; then
2121
exit 1
2222
fi
2323

24-
shift
25-
case "$1" in
26-
--unit) testType="unit" ;;
27-
--browser) testType="browser" ;;
28-
*) echo "Unknown test type: $2. Please use --unit or --browser."; exit 1 ;;
29-
esac
30-
3124
shift
3225
args=("$@")
3326

@@ -38,13 +31,9 @@ if ! command -v jq &> /dev/null; then
3831
fi
3932

4033
runTestSuite() {
41-
if [ "$testType" == "unit" ]; then
42-
echo -e "🧪 Running unit tests for $workspace...\n"
43-
(cd "$location"; pnpm exec vitest --run "${args[@]}") || { all_tests_passed=false; }
44-
elif [ "$testType" == "browser" ]; then
45-
echo -e "🧪 Running browser tests for $workspace...\n"
46-
(cd "$location"; pnpm exec playwright test "${args[@]}") || { all_tests_passed=false; }
47-
fi
34+
echo -e "🧪 Running unit tests for $workspace...\n"
35+
# Using "cd" instead of "pnpm --filter" prevent rendering issues in GitHub Actions that does not support nested groups
36+
(cd "$location"; pnpm exec vitest --run "${args[@]}") || { all_tests_passed=false; }
4837
}
4938

5039
processWorkspace() {
@@ -67,24 +56,6 @@ processWorkspace() {
6756

6857
echo -e "⏳ Processing workspace $workspace at location $location...\n"
6958

70-
echo "⚙️ Checking '$package_json_path' for peerDependencies and importmap dependencies to have the same version"
71-
deps=$(jq -r '.peerDependencies | keys[]' "$package_json_path")
72-
for library in $deps; do
73-
version=$(jq -r ".peerDependencies.\"$library\"" "$package_json_path")
74-
importmap_version=$(jq -r ".symfony.importmap.\"$library\" | if type == \"string\" then . else .version end" "$package_json_path")
75-
76-
if [ "$importmap_version" == null ]; then
77-
echo " ⚠ No importmap version found for $library in $package_json_path, skipping..."
78-
continue
79-
fi
80-
81-
if [ "$version" != "$importmap_version" ]; then
82-
echo " ⚠ Version mismatch for $library: $version (peerDependencies) vs $importmap_version (importmap)"
83-
echo " ⚠ You need to match the version of the \"peerDependency\" with the version in the \"importmap\""
84-
exit 1
85-
fi
86-
done
87-
8859
echo "⚙️ Checking '$package_json_path' for peerDependencies with multiple versions defined"
8960
deps_with_multiple_versions=$(jq -r '.peerDependencies | to_entries[] | select(.value | contains("||")) | .key' "$package_json_path")
9061

‎playwright.config.base.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
* ```typescript
77
* // src/Autocomplete/assets/playwright.config.ts
88
*
9-
* import baseConfig from '../../../../../../playwright.config.base';
9+
* import baseConfig from '../../../playwright.config.base';
1010
*
1111
* export default baseConfig;
1212
* ```

‎src/Autocomplete/assets/README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ composer require symfony/ux-autocomplete:2.23.0
1414
npm add @symfony/[email protected]
1515
```
1616

17-
**Tip:** Your `package.json` file will be automatically modified by [Flex](https://github.com/symfony/flex) when installing or upgrading a PHP package. To prevent this behavior, ensure to **use at least Flex 1.22.0 or 2.5.0**, and run `composer config extra.symfony.flex.synchronize_package_json false`.
17+
**Tip:** Your `package.json` file will be automatically modified by [Flex](https://github.com/symfony/flex) when installing or upgrading a PHP package. To prevent this behavior, ensure to **use at least Flex 1.22.0 or 2.5.0**, and run `composer config "extra.symfony/flex.synchronize_package_json" false`.
1818

1919
## Resources
2020

‎src/Autocomplete/assets/package.json‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,9 @@
1818
"build": "tsx ../../../bin/build_package.ts .",
1919
"watch": "tsx ../../../bin/build_package.ts . --watch",
2020
"test": "pnpm run test:unit && pnpm run test:browser",
21-
"test:unit": "../../../bin/test_package.sh . --unit",
22-
"test:browser": "../../../bin/test_package.sh . --browser",
21+
"test:unit": "../../../bin/unit_test_package.sh .",
22+
"test:browser": "playwright test",
23+
"test:browser:ui": "playwright test --ui",
2324
"check": "biome check",
2425
"ci": "biome ci"
2526
},

‎src/Chartjs/assets/README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ composer require symfony/ux-chartjs:2.23.0
1414
npm add @symfony/[email protected]
1515
```
1616

17-
**Tip:** Your `package.json` file will be automatically modified by [Flex](https://github.com/symfony/flex) when installing or upgrading a PHP package. To prevent this behavior, ensure to **use at least Flex 1.22.0 or 2.5.0**, and run `composer config extra.symfony.flex.synchronize_package_json false`.
17+
**Tip:** Your `package.json` file will be automatically modified by [Flex](https://github.com/symfony/flex) when installing or upgrading a PHP package. To prevent this behavior, ensure to **use at least Flex 1.22.0 or 2.5.0**, and run `composer config "extra.symfony/flex.synchronize_package_json" false`.
1818

1919
## Resources
2020

‎src/Chartjs/assets/package.json‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,9 @@
1818
"build": "tsx ../../../bin/build_package.ts .",
1919
"watch": "tsx ../../../bin/build_package.ts . --watch",
2020
"test": "pnpm run test:unit && pnpm run test:browser",
21-
"test:unit": "../../../bin/test_package.sh . --unit",
22-
"test:browser": "../../../bin/test_package.sh . --browser",
21+
"test:unit": "../../../bin/unit_test_package.sh .",
22+
"test:browser": "playwright test",
23+
"test:browser:ui": "playwright test --ui",
2324
"check": "biome check",
2425
"ci": "biome ci"
2526
},

‎src/Cropperjs/assets/README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ composer require symfony/ux-cropperjs:2.23.0
1414
npm add @symfony/[email protected]
1515
```
1616

17-
**Tip:** Your `package.json` file will be automatically modified by [Flex](https://github.com/symfony/flex) when installing or upgrading a PHP package. To prevent this behavior, ensure to **use at least Flex 1.22.0 or 2.5.0**, and run `composer config extra.symfony.flex.synchronize_package_json false`.
17+
**Tip:** Your `package.json` file will be automatically modified by [Flex](https://github.com/symfony/flex) when installing or upgrading a PHP package. To prevent this behavior, ensure to **use at least Flex 1.22.0 or 2.5.0**, and run `composer config "extra.symfony/flex.synchronize_package_json" false`.
1818

1919
## Resources
2020

0 commit comments

Comments
 (0)