mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-08 07:41:51 +08:00
265 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
| b49ba6bdfe |
chore(deps): update playwright (#30643)
This PR contains the following updates: | Package | Change | Age | Confidence | Type | Update | |---|---|---|---|---|---| | [@playwright/test](https://playwright.dev) ([source](https://redirect.github.com/microsoft/playwright)) | [`^1.54.2` -> `^1.55.0`](https://renovatebot.com/diffs/npm/@playwright%2ftest/1.54.2/1.55.0) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | devDependencies | minor | | mcr.microsoft.com/playwright | `v1.54.2` -> `v1.55.0` | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | final | minor | --- ### Release Notes <details> <summary>microsoft/playwright (@​playwright/test)</summary> ### [`v1.55.0`](https://redirect.github.com/microsoft/playwright/compare/v1.54.2...f992162f04ae0b0b5a0f4b6114b894215be98995) [Compare Source](https://redirect.github.com/microsoft/playwright/compare/v1.54.2...v1.55.0) </details> --- ### Configuration 📅 **Schedule**: Branch creation - "every weekday before 11am" (UTC), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Never, or you tick the rebase/retry checkbox. 👻 **Immortal**: This PR will be recreated if closed unmerged. Get [config help](https://redirect.github.com/renovatebot/renovate/discussions) if that's undesired. --- - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box --- This PR was generated by [Mend Renovate](https://mend.io/renovate/). View the [repository job log](https://developer.mend.io/github/ionic-team/ionic-framework). <!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiI0MS44MS4yIiwidXBkYXRlZEluVmVyIjoiNDEuODEuMiIsInRhcmdldEJyYW5jaCI6Im1haW4iLCJsYWJlbHMiOltdfQ==--> --------- Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: ionitron <hi@ionicframework.com> |
|||
| db915bf6c7 |
docs(methods): update component method documentation #4145 (#30495)
Issue number: resolves ionic-team/ionic-docs#4145 --------- ## What is the current behavior? Some component methods are missing param tags in the JSDoc comments. Some comments are out of order and the method description is below the last param description. Some back ticks are misplaced around words resulting in incorrect formatting in the docs site. ## What is the new behavior? Method documentation in app, action-sheet, alert, datetime, loading, menu, modal, popover, reorder-group, router, searchbar, and toast now include descriptions for all params, all method descriptions are placed above param descriptions, and back ticks are formatted correctly. All changes are within JSDoc comments so will result in a change to the docs site but no functional change to any components. ## Does this introduce a breaking change? - [ ] Yes - [x] No ## Other information In order to preview these changes I took the JSON generated from the build on this branch and used it in the docusaurus script in place of the fetch from unpkg. I set up a preview from my fork on Vercel - https://ionic-docs-git-temptotestdocs-soundproofboots-projects.vercel.app/docs/components . The change I made to the docusaurus script to use this temp data is here - https://github.com/soundproofboot/ionic-docs/pull/1/files. tempDocs.json is the output of the framework build after making these changes. --------- Co-authored-by: Brandy Smith <brandyscarney@users.noreply.github.com> Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com> Co-authored-by: Maria Hutt <thetaPC@users.noreply.github.com> |
|||
| 8ef79cf4fb |
chore(deps): update playwright (#30367)
This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | Type | Update | |---|---|---|---|---|---|---|---| | [@playwright/test](https://playwright.dev) ([source](https://redirect.github.com/microsoft/playwright)) | [`^1.51.1` -> `^1.52.0`](https://renovatebot.com/diffs/npm/@playwright%2ftest/1.51.1/1.52.0) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | devDependencies | minor | | mcr.microsoft.com/playwright | `v1.51.1` -> `v1.52.0` | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | final | minor | --- ### Release Notes <details> <summary>microsoft/playwright (@​playwright/test)</summary> ### [`v1.52.0`](https://redirect.github.com/microsoft/playwright/compare/v1.51.1...471930b1ceae03c9e66e0eb80c1364a1a788e7db) [Compare Source](https://redirect.github.com/microsoft/playwright/compare/v1.51.1...v1.52.0) </details> --- ### Configuration 📅 **Schedule**: Branch creation - "every weekday before 11am" (UTC), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Never, or you tick the rebase/retry checkbox. 👻 **Immortal**: This PR will be recreated if closed unmerged. Get [config help](https://redirect.github.com/renovatebot/renovate/discussions) if that's undesired. --- - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box --- This PR was generated by [Mend Renovate](https://mend.io/renovate/). View the [repository job log](https://developer.mend.io/github/ionic-team/ionic-framework). <!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzOS4yNDguNCIsInVwZGF0ZWRJblZlciI6IjM5LjI1Ny4zIiwidGFyZ2V0QnJhbmNoIjoibWFpbiIsImxhYmVscyI6W119--> --------- Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: ionitron <hi@ionicframework.com> |
|||
| d52fca084c |
fix(config): allow LogLevel to work with isolatedModules and update all warns and errors to respect logLevel (#30350)
Issue number: internal --------- ## What is the current behavior? - `LogLevel` throws error `Error: Cannot access ambient const enums when 'isolatedModules' is enabled` - Several existing console warns and errors are not calling the function that respects the `logLevel` config ## What is the new behavior? - Remove `const` from the `enum` to work with `isolatedModules` - Update `console.warn`s to `printIonWarning` - Update `console.error`s to `printIonError` ## Does this introduce a breaking change? - [ ] Yes - [x] No ## Other information Dev build: `8.5.5-dev.11744729748.174bf7e0` --------- Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com> |
|||
| c63ec2e98d |
chore(deps): update playwright (#29840)
This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | Type | Update | |---|---|---|---|---|---|---|---| | [@axe-core/playwright](https://redirect.github.com/dequelabs/axe-core-npm) | [`^4.10.0` -> `^4.10.1`](https://renovatebot.com/diffs/npm/@axe-core%2fplaywright/4.10.0/4.10.1) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | devDependencies | patch | | [@playwright/test](https://playwright.dev) ([source](https://redirect.github.com/microsoft/playwright)) | [`^1.46.1` -> `^1.51.0`](https://renovatebot.com/diffs/npm/@playwright%2ftest/1.46.1/1.51.0) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | devDependencies | minor | | mcr.microsoft.com/playwright | `v1.46.1` -> `v1.51.0` | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | final | minor | --- ### Release Notes <details> <summary>dequelabs/axe-core-npm (@​axe-core/playwright)</summary> ### [`v4.10.1`](https://redirect.github.com/dequelabs/axe-core-npm/blob/HEAD/CHANGELOG.md#4101-2024-10-29) [Compare Source](https://redirect.github.com/dequelabs/axe-core-npm/compare/v4.10.0...v4.10.1) ##### Bug Fixes - Update axe-core to v4.10.1 ([#​1124](https://redirect.github.com/dequelabs/axe-core-npm/issues/1124)) ([099818b]( |
|||
| 470decca7b |
fix(toast): swipe gesture works with custom container layout (#29999)
Issue number: resolves #29998 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? Applying a custom layout to `ion-toast::part(container)`, for example `width: 50%`, will make the part of the toast outside this element's bounds non-interactive for swiping gestures. ## What is the new behavior? Can swipe from anywhere on the toast with custom layout applied to ::part(container) ## Does this introduce a breaking change? - [ ] Yes - [X] No <!-- If this introduces a breaking change: 1. Describe the impact and migration path for existing applications below. 2. Update the BREAKING.md file with the breaking change. 3. Add "BREAKING CHANGE: [...]" to the commit description when merging. See https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer for more information. --> ## Other information | Before | After | |-------|-----------------------------------------------------| | <video src="https://github.com/user-attachments/assets/fc450066-5fb1-4fd9-bfbd-7f2cd55ce855"></video> | <video src="https://github.com/user-attachments/assets/991f6a42-f6fe-479b-9f68-7e7e35dca799"></video> | |
|||
| a745c6f4bc |
chore(deps): update playwright (#29750)
[](https://renovatebot.com) This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | Type | Update | |---|---|---|---|---|---|---|---| | [@playwright/test](https://playwright.dev) ([source](https://togithub.com/microsoft/playwright)) | [`^1.45.3` -> `^1.46.0`](https://renovatebot.com/diffs/npm/@playwright%2ftest/1.45.3/1.46.0) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | devDependencies | minor | | mcr.microsoft.com/playwright | `v1.45.3` -> `v1.46.0` | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | final | minor | --- ### Release Notes <details> <summary>microsoft/playwright (@​playwright/test)</summary> ### [`v1.46.0`](https://togithub.com/microsoft/playwright/compare/v1.45.3...99a36310570617222290c09b96a2026beb8b00f9) [Compare Source](https://togithub.com/microsoft/playwright/compare/v1.45.3...v1.46.0) </details> --- ### Configuration 📅 **Schedule**: Branch creation - "every weekday before 11am" (UTC), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Never, or you tick the rebase/retry checkbox. 👻 **Immortal**: This PR will be recreated if closed unmerged. Get [config help](https://togithub.com/renovatebot/renovate/discussions) if that's undesired. --- - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box --- This PR was generated by [Mend Renovate](https://www.mend.io/free-developer-tools/renovate/). View the [repository job log](https://developer.mend.io/github/ionic-team/ionic-framework). <!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzNy40NDAuNyIsInVwZGF0ZWRJblZlciI6IjM4LjIwLjEiLCJ0YXJnZXRCcmFuY2giOiJtYWluIiwibGFiZWxzIjpbXX0=--> --------- Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: ionitron <hi@ionicframework.com> Co-authored-by: Maria Hutt <maria@ionic.io> |
|||
| 92ce563c40 |
fix(overlays): do not overwrite id set in htmlAttributes (#29722)
Issue number: resolves #29712 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? In every type of overlay, the auto incremented overlay id is overwriting any id set in htmlAttributes. ## What is the new behavior? The id in htmlAttributes now takes precedence. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change: 1. Describe the impact and migration path for existing applications below. 2. Update the BREAKING.md file with the breaking change. 3. Add "BREAKING CHANGE: [...]" to the commit description when merging. See https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer for more information. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: Sean Perkins <13732623+sean-perkins@users.noreply.github.com> |
|||
| 0124f3b0b3 |
test(many): replace ionic buttons in e2e tests with native html buttons (#29422)
Issue number: internal --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? The `ion-button` component is used in several tests to navigate or show overlays. This causes screenshot diffs in unrelated tests any time the UI of the `ion-button` is updated. ## What is the new behavior? Removes the `ion-button` elements from unrelated tests. Did not remove the `ion-button`s from the following tests: - All `ion-button`s in an `ion-buttons` component - An `ion-button` inside of a menu - breadcrumbs/test/basic (uses a clear button in a list header, needs to be moved) - input/test/slot - item/test/buttons - item/test/colors - item/test/dividers - item/test/inputs - item/test/media - list-header/test/basic - ripple-effect/test/basic - router/test/basic - router/test/guards - router-outlet/test/basic - select/test/slot - textarea/test/slot Updates the icon/basic test to use the right icon names by comparing against the v3 names: https://ionicframework.com/docs/v3/ionicons/ ## Does this introduce a breaking change? - [ ] Yes - [x] No --------- Co-authored-by: ionitron <hi@ionicframework.com> |
|||
| 6e8bf4914f |
chore(theming): remove Sass default flags (#29401)
Issue number: N/A --------- ## What is the current behavior? Currently, every Sass variable in Ionic has the `!default` flag added to the end. From the [Sass variables documentation](https://sass-lang.com/documentation/variables/): > Normally when you assign a value to a variable, if that variable already had a value, its old value is overwritten. But if you’re writing a Sass library, you might want to allow your users to configure your library’s variables before you use them to generate CSS. > > To make this possible, Sass provides the `!default` flag. This assigns a value to a variable only if that variable isn’t defined or its value is [null](https://sass-lang.com/documentation/values/null). Otherwise, the existing value will be used. In past versions of Ionic Framework, developers wrote Sass variables to rebuild Ionic Framework using their own values. In the latest versions of Ionic Framework, this is not possible. ## What is the new behavior? Removes the `!default` flag from all Sass variables. ## Does this introduce a breaking change? - [ ] Yes - [x] No ------- Co-authored-by: brandyscarney <brandyscarney@users.noreply.github.com> |
|||
| d9f97d0f52 | chore(): add updated snapshots | |||
| b148b3225b |
chore(playwright): migrate themes to palettes (#29148)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Migrates the test infrastructure to use `palettes` instead of `themes` ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change: 1. Describe the impact and migration path for existing applications below. 2. Update the BREAKING.md file with the breaking change. 3. Add "BREAKING CHANGE: [...]" to the commit description when merging. See https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer for more information. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> This **does not** change where the light/dark/high contrast styles live or how they are consumed in the test infra. That work is done here: https://github.com/ionic-team/ionic-framework/pull/29149 Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com> |
|||
| 27fb3bacf5 | Merge remote-tracking branch 'origin/main' into sp/sync-feature-8-with-main-2 | |||
| ca61e5061b |
feat: add high contrast themes (#29010)
⚠️ This is a combination of previously approved PRs with the
exception of
|
|||
| 1ca9aa5246 |
test(toast): reset config to avoid unnecessary setTimeouts (#29004)
Issue number: Internal --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Team members are running into unexpected errors running spec tests: ``` TypeError: Cannot read properties of undefined (reading '$instanceValues$') ``` This line is the culprit: |
|||
| e833ad4649 |
docs(overlays): clarify how to remove an overlay (#28989)
In https://github.com/ionic-team/ionic-framework/issues/28981 there was some confusion surrounding how to remove an overlay from the DOM if it was never presented. The `dismiss` method will remove the overlay from the DOM, but only if the overlay is visible. Otherwise, it's a no-op. This PR updates the `dismiss` method docs for each overlay component to note that developers can use the browser's remove method to remove the element from the DOM. |
|||
| 1091534397 | chore: sync with main | |||
| 9856295915 |
refactor(toast): remove cssClass from ToastButton (#28977)
BREAKING CHANGE: The `cssClass` property has been removed from `ToastButton` |
|||
| f6fc22bba6 |
fix(action-sheet, alert, toast): button roles autocomplete with available options (#27940)
Issue number: resolves #27965 --------- https://www.youtube.com/watch?v=a_m7jxrTlaw&list=PLIvujZeVDLMx040-j1W4WFs1BxuTGdI_b&index=3 <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> There is a lack of autocomplete support for AlertButton attribute of `role` (there may be similar situations for other components too, however, I was working on this component and found it). ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Support for autocomplete for the two types defined `cancel` and `destructive`, and also supports any arbitrary string if passed in. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> I suggest there to be some global interface similar to the following: ``` interface LooseAutocomplete<T extends string> = T | Omit<string, T>; ``` I referenced this great [video](https://youtu.be/a_m7jxrTlaw) from Matt @mattpocock --------- Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com> |
|||
| 15e368c378 |
feat(theme): improved color contrast with color palette (#28791)
Issue number: Internal --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The team would like to ensure that Ionic Framework components that use an Ionic color (primary, secondary, etc) on top of a contrast color pass minimum contrast ratios as defined in the WCAG. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Introduces a revised set of Ionic colors that pass AA color contrast guidelines when with the appropriate contrast. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change: 1. Describe the impact and migration path for existing applications below. 2. Update the BREAKING.md file with the breaking change. 3. Add "BREAKING CHANGE: [...]" to the commit description when merging. See https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer for more information. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: Sean Perkins <13732623+sean-perkins@users.noreply.github.com> Co-authored-by: Brandy Carney <brandy@ionic.io> Co-authored-by: Sean Perkins <sean@ionic.io> Co-authored-by: Shawn Taylor <shawn@ionic.io> Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com> Co-authored-by: Amanda Johnston <90629384+amandaejohnston@users.noreply.github.com> Co-authored-by: Maria Hutt <thetaPC@users.noreply.github.com> Co-authored-by: ionitron <hi@ionicframework.com> |
|||
| e51deed21c | Merge remote-tracking branch 'origin/main' into sync-76-125 | |||
| a3cd204f61 |
fix(overlays): trigger is configured on load (#28526)
Issue number: resolves #28524 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Watchers in Stencil are constructed sometime between `connectedCallback` and `componentDidLoad`. If a property is set/changed during that time it is possible for the callback associated with the watcher to not fire because the watcher has not been setup yet. This is most often with `dist-custom-elements` and frameworks such as Angular when using a binding (i.e. `[trigger]` instead of `trigger`) ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - The trigger callback associated with the watcher is manually called in `componentDidLoad` for each overlay. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.5.5-dev.11699974376.13a15397` Note: This is a timing related bug due to a behavior in Stencil, so I did not write automated tests. However, I manually verified that this issue a) reproduces on `main` and b) is fixed with this dev build for each overlay component. |
|||
| fd36b953d6 | chore: sync | |||
| 4ad6df67f0 | fix(toast): add swipeGesture to ToastOptions (#28518) | |||
| 4f1b4cdc29 |
chore(core): type checking for unit tests (#28529)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Type checking inside of the Stencil unit tests have been disabled for a long time. This has resulted in a difficult developer experience and numerous issues (both types and implementation) within our unit tests. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Type checking is now enabled for all Stencil unit tests - Tests have been updated to resolve type errors and implementation errors - Many `as any` casts were introduced, as many legacy tests test invalid configurations of functions that require it (for example passing `undefined` to an argument that cannot be `undefined`). ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> To test this PR you can checkout the branch locally. Install dependencies in the `/core` directory to make sure you are on at least `@stencil/core@4.7.2`. Opening either a `.spec.ts` or `.spec.tsx` file, validate that your IDE detects types and can provide auto completions for jest global types. If you desire, you can provide an invalid type and try building the project - you will observe the build will fail due to the invalid type. |
|||
| 30c21aab3e |
feat(toast): add swipe to dismiss functionality (#28442)
Issue number: resolves #21769 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Toast does not support swipe gestures to dismiss. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Added a `swipeGesture` property that allows users to swipe toasts closed. Note: This is a combination of previous PRs https://github.com/ionic-team/ionic-framework/pull/28380 and https://github.com/ionic-team/ionic-framework/pull/28402 ⚠️ There is a visual glitch on iOS where dragging and having the toast animate back to its opened position causes a flicker. This is an iOS 17 regression and is being tracked in https://github.com/ionic-team/ionic-framework/issues/28467. This bug has been reported to and confirmed by Apple. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> ⚠️ Give co-author credit to author in https://github.com/ionic-team/ionic-framework/pull/23124 --------- Co-authored-by: evgeniy-skakun <evgeniy-skakun@users.noreply.github.com> |
|||
| 11fd074972 | Merge remote-tracking branch 'origin/main' into sp/sync-feature-7-6-with-main | |||
| 0e2797bd33 | refactor(toast): md animation uses transform (#28392) | |||
| c801e2ada9 |
chore: remove unused sass variables (#28363)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> This project has several unused Sass variables still in the code base. The team would like to remove these. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Removed unused Sass variables ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> The original scope of this ticket was for checkbox only, but many other components had unused sass variables, so I decided to tackle everything all at once. Since these variables are not used anywhere: 1. The build should pass 2. There should be no screenshot diffs |
|||
| f8067819ee |
feat(a11y): add dynamic font scaling (#28314)
Issue number: resolves #24638, resolves #18592 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Developers have requested that Ionic Framework support the dynamic type feature on iOS for accessibility purposes. Ionic applications do not respond to font scaling on iOS which can create inaccessible applications particularly for users with low vision. Ionic apps on Android devices currently support the Android equivalent due to functionality in the Chromium webview. Developers have also requested a way of adjusting the fonts in their Ionic UI components consistently. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Ionic components now use `rem` instead of `px` where appropriate. This means devs can change the font size on `html` and the text in supported Ionic components will scale up/down appropriately - Add support for Dynamic Type on iOS (the iOS version of Dynamic Font Scaling) ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: Maria Hutt <thetaPC@users.noreply.github.com> Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com> Co-authored-by: Shawn Taylor <shawn@ionic.io> Co-authored-by: ionitron <hi@ionicframework.com> Co-authored-by: Sean Perkins <sean@ionic.io> Co-authored-by: Sean Perkins <13732623+sean-perkins@users.noreply.github.com> Co-authored-by: Amanda Johnston <90629384+amandaejohnston@users.noreply.github.com> |
|||
| c37b3d8bf4 | fix(toast): toast does not warn when positionAnchor is undefined (#28312) | |||
| 897ff6f749 |
feat(toast): allow custom positioning relative to specific element (#28248)
Issue number: resolves #17499 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Currently, there isn't a way to position toasts such that they don't overlap navigation elements such as headers, footers, and FABs. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> Added the new `positionAnchor` property, which specifies an element that the toast's position should be anchored to. While the name can be tweaked, we should take care to keep the relation between it and the `position` property clear. The `position` acts as a sort of "origin" point, and the toast is moved from there to sit near the chosen anchor element. This is important because it helps clarify why the toast sits above the anchor for `position="bottom"` and vice versa. I chose not to rename the `position` prop itself to avoid breaking changes. Docs PR: https://github.com/ionic-team/ionic-docs/pull/3158 ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: ionitron <hi@ionicframework.com> Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com> |
|||
| a5f14e3933 |
chore(deps-dev): Bump @playwright/test from 1.37.1 to 1.38.0 in /core (#28171)
Bumps [@playwright/test](https://github.com/Microsoft/playwright) from 1.37.1 to 1.38.0. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/Microsoft/playwright/releases"><code>@playwright/test</code>'s releases</a>.</em></p> <blockquote> <h2>v1.38.0</h2> <h2>UI Mode Updates</h2> <p><img src="https://github.com/microsoft/playwright/assets/746130/8ba27be0-58fd-4f62-8561-950480610369" alt="Playwright UI Mode" /></p> <ol> <li>Zoom into time range.</li> <li>Network panel redesign.</li> </ol> <h2>New APIs</h2> <ul> <li>[<code>browserContext.on('weberror')</code>]</li> <li>[<code>locator.pressSequentially()</code>]</li> <li>The [<code>reporter.onEnd()</code>] now reports <code>startTime</code> and total run <code>duration</code>.</li> </ul> <h2>Deprecations</h2> <ul> <li>The following methods were deprecated: [<code>page.type()</code>], [<code>frame.type()</code>], [<code>locator.type()</code>] and [<code>elementHandle.type()</code>]. Please use [<code>locator.fill()</code>] instead which is much faster. Use [<code>locator.pressSequentially()</code>] only if there is a special keyboard handling on the page, and you need to press keys one-by-one.</li> <li>The method [<code>expect(value).toMatchSnapshot()</code>] is deprecated in favor of [<code>expect(page).toHaveScreenshot()</code>] and [<code>expect(locator).toHaveScreenshot()</code>].</li> </ul> <h2>Breaking Changes: Playwright no longer downloads browsers automatically</h2> <blockquote> <p>[!NOTE] If you are using <code>@playwright/test</code> package, this change <strong>does not</strong> affect you.</p> </blockquote> <p>Playwright recommends to use <code>@playwright/test</code> package and download browsers via <code>npx playwright install</code> command. If you are following this recommendation, nothing has changed for you.</p> <p>However, up to v1.38, installing the <code>playwright</code> package instead of <code>@playwright/test</code> did automatically download browsers. This is no longer the case, and we recommend to explicitly download browsers via <code>npx playwright install</code> command.</p> <p><strong>v1.37 and earlier</strong></p> <p><code>playwright</code> package was downloading browsers during <code>npm install</code>, while <code>@playwright/test</code> was not.</p> <p><strong>v1.38 and later</strong></p> <p><code>playwright</code> and <code>@playwright/test</code> packages do not download browsers during <code>npm install</code>.</p> <p><strong>Recommended migration</strong></p> <p>Run <code>npx playwright install</code> to download browsers after <code>npm install</code>. For example, in your CI configuration:</p> <pre lang="yml"><code>- run: npm ci - run: npx playwright install --with-deps </code></pre> <p><strong>Alternative migration option - not recommended</strong></p> <!-- raw HTML omitted --> </blockquote> <p>... (truncated)</p> </details> <details> <summary>Commits</summary> <ul> <li><a href=" |
|||
| e6c09291f5 | Merge remote-tracking branch 'origin/main' into sync-feature-7.4 | |||
| 584e9d3be2 |
fix(overlays): prevent overlays from getting stuck open (#28069)
Issue number: resolves #27200 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> A bug occurs when you click twice quickly to open an overlay with a small timeout. In some cases, the overlay will present, dismiss, present, then not dismiss the second time, getting stuck open. You can reproduce manually this by grabbing the test HTML included in this PR and putting it in a branch that doesn't include a fix. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - When an overlay with a short timeout is triggered twice quickly, it will open-close-open-close. - The behavior is the same for all overlay components ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Relevant links: * https://github.com/ionic-team/ionic-framework/issues/27200 * https://ionic-cloud.atlassian.net/browse/FW-4374 * https://ionic-cloud.atlassian.net/browse/FW-4053 I'm not sure how to write an automated test for this bug due to the short timeout required. You can manually test the fix in [this Stackblitz](https://stackblitz.com/edit/g1kjci?file=package.json) by changing the Ionic version between 7.3.1 and 7.3.2-dev.11693262117.17edbf6d --------- Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com> |
|||
| ae9f1ab43e | refactor(toast): deprecate cssClass on ToastButton (#27959) | |||
| e9faf54d0a |
feat(toast): add shadow part for cancel button (#27921)
resolves #27920 |
|||
| 3f093cec4f | Merge remote-tracking branch 'origin/main' into sync-7.3-with-main | |||
| a0e6ac6013 |
fix(many): overlays present if isOpen is true on load (#27933)
Issue number: resolves #27928 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Action sheet, alert, picker, and toast did not have logic where the overlay presents if `isOpen="true"` on load. Modal, popover, and loading had this logic but did not have test coverage. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Updated action sheet, alert, picker, and toast to present if `isOpen="true"` on load - Added test coverage to all overlays for this functionality. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.2.3-dev.11691156718.1638345c` |
|||
| 9a685882b7 |
feat(toast): add htmlAttributes property for passing attributes to buttons (#27855)
Issue number: N/A --------- ## What is the current behavior? Buttons containing only icons are not accessible as there is no way to pass an `aria-label` attribute (or any other html attribute). ## What is the new behavior? - Adds the `htmlAttributes` property on the `ToastButton` interface - Passes the `htmlAttributes` to the buttons - Adds a test to verify `aria-label` and `aria-labelled-by` are passed to the button ## Does this introduce a breaking change? - [ ] Yes - [x] No |
|||
| 6fab2a98b3 | chore(): sync with main | |||
| d555375c14 |
fix(toast): allow color for translucent toast (#27652)
Issue number: resolves #27567 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? Translucent toasts do not have the appropriate background color when the `color` property is set on the toast. <!-- Please describe the current behavior that you are modifying. --> <img width="554" alt="Screenshot 2023-06-14 at 5 46 45 PM" src="https://github.com/ionic-team/ionic-framework/assets/14926794/05f7522c-23bc-44f8-af42-b82034cbe067"> ## What is the new behavior? - Translucent toasts can have a background color based on the `color` property of the toast. <!-- Please describe the behavior or changes that are being added by this PR. --> <img width="553" alt="Screenshot 2023-06-14 at 5 46 28 PM" src="https://github.com/ionic-team/ionic-framework/assets/14926794/28a6345b-5bf3-494c-af81-0d53877295df"> ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information Note: Translucent toasts are only available in `ios` mode. <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: ionitron <hi@ionicframework.com> |
|||
| e75fa582c4 |
fix(header, footer): resolve CSP violations with box shadow (#27560)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The `ion-header` and `ion-footer` use a base64 encoded image for a box shadow instead of using the CSS box-shadow property directly. The use of the background image creates CSP violations. The historic reasoning of using an image instead of box shadow was to improve scroll performance. Browsers and devices have improved a lot since that was implemented (5 years ago). ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Updates the usage of `ion-header` and `ion-footer` to use a box shadow. The value comes from Material's web implementation: https://material-components.github.io/material-components-web-catalog/#/component/top-app-bar ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: ionitron <hi@ionicframework.com> |
|||
| 66d959f5bf | Merge remote-tracking branch 'origin/main' into sp/sync-feature-7.1-with-main | |||
| 58d6dae9a1 |
chore(deps-dev): Bump @playwright/test from 1.33.0 to 1.34.1 in /core (#27533)
Bumps [@playwright/test](https://github.com/Microsoft/playwright) from 1.33.0 to 1.34.0. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/Microsoft/playwright/releases"><code>@playwright/test</code>'s releases</a>.</em></p> <blockquote> <h2>v1.34.0</h2> <h3>Highlights</h3> <ul> <li> <p>UI Mode now shows steps, fixtures and attachments: <!-- raw HTML omitted --></p> </li> <li> <p>New property <a href="https://playwright.dev/docs/api/class-testproject#test-project-teardown"><code>testProject.teardown</code></a> to specify a project that needs to run after this and all dependent projects have finished. Teardown is useful to cleanup any resources acquired by this project.</p> <p>A common pattern would be a <code>setup</code> dependency with a corresponding <code>teardown</code>:</p> <pre lang="js"><code>// playwright.config.ts import { defineConfig } from '@playwright/test'; <p>export default defineConfig({ projects: [ { name: 'setup', testMatch: /global.setup.ts/, teardown: 'teardown', }, { name: 'teardown', testMatch: /global.teardown.ts/, }, { name: 'chromium', use: devices['Desktop Chrome'], dependencies: ['setup'], }, { name: 'firefox', use: devices['Desktop Firefox'], dependencies: ['setup'], }, { name: 'webkit', use: devices['Desktop Safari'], dependencies: ['setup'], }, ], }); </code></pre></p> </li> <li> <p>New method <a href="https://playwright.dev/docs/test-assertions#expectconfigure"><code>expect.configure</code></a> to create pre-configured expect instance with its own defaults such as <code>timeout</code> and <code>soft</code>.</p> <pre lang="js"><code>const slowExpect = expect.configure({ timeout: 10000 }); await slowExpect(locator).toHaveText('Submit'); <p>// Always do soft assertions. const softExpect = expect.configure({ soft: true }); </code></pre></p> </li> </ul> <!-- raw HTML omitted --> </blockquote> <p>... (truncated)</p> </details> <details> <summary>Commits</summary> <ul> <li><a href=" |
|||
| 159bffbb5f | chore(): sync with main | |||
| eba4c7f6e6 |
test(toast): clean up tests (#27435)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> There are several redundant tests I missed during my generator pass. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> |
|||
| 5e55bef3bc |
chore(deps-dev): bump @playwright/test from 1.32.3 to 1.33.0 in /core (#27313)
Bumps [@playwright/test](https://github.com/Microsoft/playwright) from 1.32.3 to 1.33.0. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/Microsoft/playwright/releases"><code>@playwright/test</code>'s releases</a>.</em></p> <blockquote> <h2>v1.33.0</h2> <h3>Locators Update</h3> <ul> <li> <p>Use [<code>locator.or()</code>] to create a locator that matches either of the two locators. Consider a scenario where you'd like to click on a "New email" button, but sometimes a security settings dialog shows up instead. In this case, you can wait for either a "New email" button, or a dialog and act accordingly:</p> <pre lang="js"><code>const newEmail = page.getByRole('button', { name: 'New' }); const dialog = page.getByText('Confirm security settings'); await expect(newEmail.or(dialog)).toBeVisible(); if (await dialog.isVisible()) await page.getByRole('button', { name: 'Dismiss' }).click(); await newEmail.click(); </code></pre> </li> <li> <p>Use new options <code>hasNot</code> and <code>hasNotText</code> in [<code>locator.filter()</code>] to find elements that <strong>do not match</strong> certain conditions.</p> <pre lang="js"><code>const rowLocator = page.locator('tr'); await rowLocator .filter({ hasNotText: 'text in column 1' }) .filter({ hasNot: page.getByRole('button', { name: 'column 2 button' }) }) .screenshot(); </code></pre> </li> <li> <p>Use new web-first assertion [<code>locatorAssertions.toBeAttached()</code>] to ensure that the element is present in the page's DOM. Do not confuse with the [<code>locatorAssertions.toBeVisible()</code>] that ensures that element is both attached & visible.</p> </li> </ul> <h3>New APIs</h3> <ul> <li>[<code>locator.or()</code>]</li> <li>New option <code>hasNot</code> in [<code>locator.filter()</code>]</li> <li>New option <code>hasNotText</code> in [<code>locator.filter()</code>]</li> <li>[<code>locatorAssertions.toBeAttached()</code>]</li> <li>New option <code>timeout</code> in [<code>route.fetch()</code>]</li> <li>[<code>reporter.onExit()</code>]</li> </ul> <h3>⚠️ Breaking change</h3> <ul> <li>The <code>mcr.microsoft.com/playwright:v1.33.0</code> now serves a Playwright image based on Ubuntu Jammy. To use the focal-based image, please use <code>mcr.microsoft.com/playwright:v1.33.0-focal</code> instead.</li> </ul> <h3>Browser Versions</h3> <ul> <li>Chromium 113.0.5672.53</li> <li>Mozilla Firefox 112.0</li> <li>WebKit 16.4</li> </ul> <p>This version was also tested against the following stable channels:</p> <!-- raw HTML omitted --> </blockquote> <p>... (truncated)</p> </details> <details> <summary>Commits</summary> <ul> <li><a href=" |
|||
| 8043fcf42c | lint | |||
| 6c68c56a7f | Merge remote-tracking branch 'origin/main' into chore/sync-with-main-6 |
