diff --git a/.github/dependabot.yml b/.github/dependabot.yml index ee03fceb4..1053adad8 100644 --- a/.github/dependabot.yml +++ b/.github/dependabot.yml @@ -58,6 +58,31 @@ updates: - '@commitlint*' - '@babel*' + - package-ecosystem: 'npm' + directory: '/showcase/angular-lts-showcase' + open-pull-requests-limit: 10 + schedule: + interval: 'daily' + time: '04:00' + timezone: 'Europe/Berlin' + ignore: + - dependency-name: 'ng-packagr' + update-types: ['version-update:semver-major'] + # Especially as we're using multiple major versions of Angular, we want to update the major version by ourselves + - dependency-name: '@angular/cli' + update-types: ['version-update:semver-major'] + - dependency-name: '@angular/core' + update-types: ['version-update:semver-major'] + - dependency-name: '@angular/compiler' + update-types: ['version-update:semver-major'] + - dependency-name: '@angular/common' + update-types: ['version-update:semver-major'] + - dependency-name: '@angular/forms' + update-types: ['version-update:semver-major'] + - dependency-name: '@angular/platform-browser-dynamic' + update-types: ['version-update:semver-major'] + pull-request-branch-name: + separator: '-' - package-ecosystem: 'npm' directory: '/showcase/angular-lts-minus-1-showcase' open-pull-requests-limit: 10 diff --git a/.github/labeler.yml b/.github/labeler.yml index 0f5c369a3..d61c8e525 100644 --- a/.github/labeler.yml +++ b/.github/labeler.yml @@ -24,6 +24,10 @@ react: vue: - packages/db-ui-elements-vue/** +# Add 'angular-lts-showcase' label to any file changes for angular-lts-showcase +angular-lts-showcase: + - showcase/angular-lts-showcase/** + # Add 'angular-lts-minus-1-showcase' label to any file changes for angular-lts-minus-1-showcase angular-lts-minus-1-showcase: - showcase/angular-lts-minus-1-showcase/** diff --git a/.github/workflows/01-build-all.yml b/.github/workflows/01-build-all.yml index 998250faf..354325e27 100644 --- a/.github/workflows/01-build-all.yml +++ b/.github/workflows/01-build-all.yml @@ -17,7 +17,7 @@ jobs: - name: 👩‍🍳 Bake everything (StoryBook, Playground & Showcases) run: | - node scripts/build angular-lts-minus-1,react,vue,playground,reactwind withShowcase + node scripts/build angular-lts-minus-1,angular-lts,react,vue,playground,reactwind withShowcase npm run build:storybook - name: ⬆ Upload build diff --git a/.github/workflows/01-build-showcases.yml b/.github/workflows/01-build-showcases.yml index 832adff4c..bcaefff21 100644 --- a/.github/workflows/01-build-showcases.yml +++ b/.github/workflows/01-build-showcases.yml @@ -11,7 +11,8 @@ jobs: strategy: fail-fast: false matrix: - showcases: [angular-lts-minus-1, playground, react, reactwind, vue] + showcases: + [angular-lts-minus-1, angular-lts, playground, react, reactwind, vue] steps: - name: ⬇ Checkout repo uses: actions/checkout@v4 @@ -22,6 +23,9 @@ jobs: - name: ↔ Get download params for showcase run: | if echo ${{ matrix.showcases }} | grep -c "angular-lts-minus-1" + then + echo "framework=angular" >> $GITHUB_OUTPUT + elif echo ${{ matrix.showcases }} | grep -c "angular-lts" then echo "framework=angular" >> $GITHUB_OUTPUT elif echo ${{ matrix.showcases }} | grep -c "playground" diff --git a/.github/workflows/01-build-storybook.yml b/.github/workflows/01-build-storybook.yml index 7f91195fa..a27359a90 100644 --- a/.github/workflows/01-build-storybook.yml +++ b/.github/workflows/01-build-storybook.yml @@ -27,12 +27,18 @@ jobs: name: stencil-default-angular path: packages/db-ui-elements-stencil - - name: ⬇ Download Showcase Angular LTS v.14 dist folder + - name: ⬇ Download Showcase Angular LTS -1 dist folder uses: ./.github/actions/download-tar-artifact with: name: showcase-angular-lts-minus-1 path: showcase/angular-lts-minus-1-showcase/dist + - name: ⬇ Download Showcase Angular LTS dist folder + uses: ./.github/actions/download-tar-artifact + with: + name: showcase-angular-lts + path: showcase/angular-lts-showcase/dist + - name: ⬇ Download Showcase playground dist folder uses: ./.github/actions/download-tar-artifact with: @@ -62,6 +68,7 @@ jobs: VERSION: ${{ inputs.tag }} run: | mv showcase/angular-lts-minus-1-showcase/dist/angular-lts-minus-1-showcase packages/db-ui-elements-stencil/www/angular-lts-minus-1-showcase + mv showcase/angular-lts-showcase/dist/angular-lts-showcase packages/db-ui-elements-stencil/www/angular-lts-showcase mv showcase/playground-showcase/dist/playground-showcase packages/db-ui-elements-stencil/www/playground-showcase mv showcase/react-showcase/dist/react-showcase packages/db-ui-elements-stencil/www/react-showcase mv showcase/reactwind-showcase/dist/reactwind-showcase packages/db-ui-elements-stencil/www/reactwind-showcase diff --git a/.vscode/extensions.json b/.vscode/extensions.json index 29bccaef4..508bb14f8 100644 --- a/.vscode/extensions.json +++ b/.vscode/extensions.json @@ -5,6 +5,6 @@ "streetsidesoftware.code-spell-checker", "html-validate.vscode-html-validate", "deque-systems.vscode-axe-linter", - "esbenp.prettier-vscode" + "esbenp.prettier-vscode" ] } diff --git a/README.md b/README.md index 124071ffa..306ef5266 100644 --- a/README.md +++ b/README.md @@ -58,6 +58,7 @@ If you miss a component than [contribute](CONTRIBUTING.md), please. ## Framework showcases * [DB UI Elements with React (CRA)](showcase/react-showcase/README.md) +* [DB UI Elements with Angular 15](showcase/angular-lts-showcase/README.md) * [DB UI Elements with Angular 14](showcase/angular-lts-minus-1-showcase/README.md) * [DB UI Elements with Vue](showcase/vue-showcase/README.md) diff --git a/doc/howto-angular.md b/doc/howto-angular.md index 49261a74e..41c92af7b 100644 --- a/doc/howto-angular.md +++ b/doc/howto-angular.md @@ -127,6 +127,8 @@ There are 3 ways to use Events in Angular: ### Example -[Angular Showcase GitHub](https://github.com/db-ui/elements/tree/main/showcase/angular-lts-minus-1-showcase) +[Angular v.15 Showcase GitHub](https://github.com/db-ui/elements/tree/main/showcase/angular-lts-showcase) +[Angular v.15 Showcase App](https://db-ui.github.io/elements/angular-lts-showcase/) -[Angular Showcase App](https://db-ui.github.io/elements/angular-lts-minus-1-showcase/) +[Angular v.14 Showcase GitHub](https://github.com/db-ui/elements/tree/main/showcase/angular-lts-minus-1-showcase) +[Angular v.14 Showcase App](https://db-ui.github.io/elements/angular-lts-minus-1-showcase/) diff --git a/e2e/cypress/e2e/99-1-showcases/showcases-tables.cy.js b/e2e/cypress/e2e/99-1-showcases/showcases-tables.cy.js index f9c29804f..1a77d02c6 100644 --- a/e2e/cypress/e2e/99-1-showcases/showcases-tables.cy.js +++ b/e2e/cypress/e2e/99-1-showcases/showcases-tables.cy.js @@ -1,31 +1,30 @@ context('showcase', () => { - const showcases = require('../../fixtures/showcases.json'); + const showcases = ['angular-lts-minus-1', 'angular-lts']; - //showcases.forEach((showcase) => { - const showcase = 'angular-lts-minus-1'; - it(`${showcase}: Test Tables`, () => { - cy.showcaseGoto(showcase, 'Tables'); + showcases.forEach((showcase) => { + it(`${showcase}: Test Tables`, () => { + cy.showcaseGoto(showcase, 'Tables'); - // 1. DbPagination - cy.get('db-pagination > nav > ol > li').eq(6).contains('…'); - cy.get('db-pagination > nav > ol > li > button') - .eq(2) - .invoke('attr', 'aria-current') - .should('eq', 'page'); - Array.from(Array(7)).forEach(() => { - cy.get('db-pagination > nav > ol > li > button').last().click(); - }); - cy.get('db-pagination > nav > ol > li > button') - .eq(7) - .invoke('attr', 'aria-current') - .should('eq', 'page'); + // 1. DbPagination + cy.get('db-pagination > nav > ol > li').eq(6).contains('…'); + cy.get('db-pagination > nav > ol > li > button') + .eq(2) + .invoke('attr', 'aria-current') + .should('eq', 'page'); + Array.from(Array(7)).forEach(() => { + cy.get('db-pagination > nav > ol > li > button').last().click(); + }); + cy.get('db-pagination > nav > ol > li > button') + .eq(7) + .invoke('attr', 'aria-current') + .should('eq', 'page'); - // 2. Table + // 2. Table - cy.get('table').eq(0).find('td').should('have.length', 6); - cy.get('table').eq(1).find('td').should('have.length', 6); + cy.get('table').eq(0).find('td').should('have.length', 6); + cy.get('table').eq(1).find('td').should('have.length', 6); - // + // + }); }); - //}); }); diff --git a/e2e/cypress/fixtures/showcases.json b/e2e/cypress/fixtures/showcases.json index 1348c6115..139643727 100644 --- a/e2e/cypress/fixtures/showcases.json +++ b/e2e/cypress/fixtures/showcases.json @@ -1 +1 @@ -["angular-lts-minus-1", "react", "vue"] +["angular-lts-minus-1", "angular-lts", "react", "vue"] diff --git a/package.json b/package.json index 018e85b0b..5fc6dc794 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "@db-ui/elements-monorepo", "version": "0.0.0", "scripts": { - "prepare": "cd showcase/react-showcase && npm i && cd ../angular-lts-minus-1-showcase && npm i && cd ../vue-showcase && npm i && cd ../playground-showcase && npm i && cd ../../ && husky install", + "prepare": "cd showcase/react-showcase && npm i && cd ../angular-lts-minus-1-showcase && npm i && cd ../angular-lts-showcase && npm i && cd ../vue-showcase && npm i && cd ../playground-showcase && npm i && cd ../../ && husky install", "start": "concurrently \"npm run build.watch.enterprise --workspace=@db-ui/elements\" \"npm run start:storybook\"", "start:storybook": "start-storybook -c .storybook -p 6006 --ci", "watch:showcase:react": "concurrently \"npm run build.watch.local --workspace=@db-ui/elements\" \"npm run watch --workspace=@db-ui/react-elements\"", @@ -15,7 +15,7 @@ "cypress": "npx cypress run --project ./e2e --env type=actual", "cypress:watch": "npx cypress open --project ./e2e --env type=actual", "cypress:ci": "start-server-and-test start:storybook http://localhost:6006 cypress", - "cypress:full": "node scripts/build angular-lts-minus-1,playground,react,reactwind,vue withShowcase && concurrently \"npm run cypress:watch\" \"npm run start:storybook\"", + "cypress:full": "node scripts/build angular-lts-minus-1,angular-lts,playground,react,reactwind,vue withShowcase && concurrently \"npm run cypress:watch\" \"npm run start:storybook\"", "cypress:snapshot:base": "npx cypress run --project ./e2e --env type=base --config screenshotsFolder=e2e/cypress/snapshots/base", "postcypress:snapshot:base": "rimraf --glob e2e/cypress/snapshots/base/**/*-base-*.png && node ./scripts/cypress/snapshot-helper.js", "lint:markdownlint": "markdownlint -c .markdown-lint.yml '**/*.md'", diff --git a/packages/db-ui-elements-stencil/src/stories/showcase/showcase-angular.stories.tsx b/packages/db-ui-elements-stencil/src/stories/showcase/showcase-angular-lts-minus-1.stories.tsx similarity index 100% rename from packages/db-ui-elements-stencil/src/stories/showcase/showcase-angular.stories.tsx rename to packages/db-ui-elements-stencil/src/stories/showcase/showcase-angular-lts-minus-1.stories.tsx diff --git a/packages/db-ui-elements-stencil/src/stories/showcase/showcase-angular-lts.stories.tsx b/packages/db-ui-elements-stencil/src/stories/showcase/showcase-angular-lts.stories.tsx new file mode 100644 index 000000000..9ba48ef59 --- /dev/null +++ b/packages/db-ui-elements-stencil/src/stories/showcase/showcase-angular-lts.stories.tsx @@ -0,0 +1,14 @@ +import './showcase.css'; + +export default { + title: '00-Intro/Showcases', + parameters: { + layout: 'fullscreen' + } +}; + +export const Angular_NG_build = () => { + return `
+