mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 11:41:20 +08:00
3863 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
| f450f0a58a |
chore(deps-dev): Bump @capacitor/core from 5.2.3 to 5.3.0 in /core (#28053)
Bumps [@capacitor/core](https://github.com/ionic-team/capacitor) from 5.2.3 to 5.3.0. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/capacitor/releases"><code>@capacitor/core</code>'s releases</a>.</em></p> <blockquote> <h2>5.3.0</h2> <h1><a href="https://github.com/ionic-team/capacitor/compare/5.2.3...5.3.0">5.3.0</a> (2023-08-23)</h1> <h3>Bug Fixes</h3> <ul> <li><strong>cookies:</strong> remove session cookies when initializing the cookie manager (<a href=" |
|||
| 5701f7661e | v7.3.1 | |||
| e2be7fdf3a |
docs(picker): describe how to set the initial value of a picker column (#28034)
## What is the current behavior? There is no description of how to set the value of a picker. ## What is the new behavior? Readers can find this description in the documentation. ## Does this introduce a breaking change? - [ ] Yes - [x] No --------- Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com> |
|||
| 5a1bbc9fa3 |
chore(deps): Bump @stencil/core from 4.0.3 to 4.1.0 in /core (#28037)
Bumps [@stencil/core](https://github.com/ionic-team/stencil) from 4.0.3 to 4.1.0. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/stencil/releases"><code>@stencil/core</code>'s releases</a>.</em></p> <blockquote> <h2>🐟 4.1.0 (2023-08-21)</h2> <h3>Bug Fixes</h3> <ul> <li><strong>runtime:</strong> adds a testing check to the forceUpdate method (<a href="https://redirect.github.com/ionic-team/stencil/issues/4682">#4682</a>) (<a href=" |
|||
| 679821861a |
chore(deps-dev): Bump @playwright/test from 1.37.0 to 1.37.1 in /core (#28023)
Bumps [@playwright/test](https://github.com/Microsoft/playwright) from 1.37.0 to 1.37.1. <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.37.1</h2> <h3>Highlights</h3> <p><a href="https://redirect.github.com/microsoft/playwright/issues/26496">microsoft/playwright#26496</a> - [REGRESSION] webServer stdout is always getting printed <a href="https://redirect.github.com/microsoft/playwright/issues/26492">microsoft/playwright#26492</a> - [REGRESSION] test.only with project dependency is not working</p> <h2>Browser Versions</h2> <ul> <li>Chromium 116.0.5845.82</li> <li>Mozilla Firefox 115.0</li> <li>WebKit 17.0</li> </ul> <p>This version was also tested against the following stable channels:</p> <ul> <li>Google Chrome 115</li> <li>Microsoft Edge 115</li> </ul> </blockquote> </details> <details> <summary>Commits</summary> <ul> <li><a href=" |
|||
| 444acc1f1b |
fix(input, textarea): clearOnEdit does not clear when pressing Tab (#28005)
Issue number: resolves #27746 --------- <!-- 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. --> Pressing the Tab key when focused on an input/textarea with `clearOnEdit` clears the text field and then moves focus to the next focusable element. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Pressing the Tab key does not clear the text field even when clearOnEdit is enabled. - Added test coverage - I also noticed that input did not have an `index.html` file in the basic directory, so I added that. ## 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.3.1-dev.11692202566.13cd16c4` |
|||
| 6bcefcd9ed |
docs(button): add comments to renderHiddenButton (#28017)
As part of our incident learning review, the team would like to add better documentation as to the purpose of `renderHiddenButton` for future reference. |
|||
| 16f7ec2284 | v7.3.0 | |||
| 076cadb696 | Merge remote-tracking branch 'origin/main' into sync7-3-final | |||
| ffe5307905 | v7.2.4 | |||
| 6ee41fd639 | Merge remote-tracking branch 'origin/main' into sync-73-815 | |||
| eafa7b5dc6 |
test(many): gestures flakiness (#27808)
Issue number: multiple internals --------- <!-- 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. --> Multiple tests that use gestures are flaky on GitHub. Due to that those tests are being skipped. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - `page.mouse.move` will not work as expected if it the mouse moves outside of the viewport. This may lead to events to not fire every time. There's now a check to determine if the coordinates are valid. If they are not, then it will update the coordinates to be as close to the viewport's edge instead of being outside. - Safari doesn't repaint the frame as often as the other browsers. This causes the tests on GitHub to appear to be lagging. Now the frame is forced to repaint only for Safari. - Most tests are no longer being skipped. - Range is still having issues on GitHub. It is no longer flaky locally with the changes in this PR. I've had to revert them back to skip until further notice. ## 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. --> If this PR is merged, then: - FW-3006, FW-2795, and FW-3079 can be closed - FW-4556 still needs to remain open since range is still flaky on GitHub --------- Co-authored-by: ionitron <hi@ionicframework.com> Co-authored-by: Amanda Johnston <90629384+amandaejohnston@users.noreply.github.com> |
|||
| 92b13c298b |
chore: highlight variables are deprecated (#27987)
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 was some confusion on https://github.com/ionic-team/ionic-framework/issues/27985 as to how the `--highlight-*` variables on `ion-item` apply to the modern form controls. These variables only work with the legacy form syntax, but we did not add a proper deprecation message. `--highlight-*` variables have been added to `ion-input` and `ion-textarea` instead so developers can customize the highlight when using the modern form syntax. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Deprecated the `--highlight-*` variables on `ion-item`. ## 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. --> |
|||
| e5a02f49e5 |
chore(deps-dev): Bump @playwright/test from 1.36.2 to 1.37.0 in /core (#27977)
Bumps [@playwright/test](https://github.com/Microsoft/playwright) from 1.36.2 to 1.37.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.37.0</h2> <h2>✨ New tool to merge reports</h2> <p>If you run tests on multiple shards, you can now merge all reports in a single HTML report (or any other report) using the new <code>merge-reports</code> CLI tool.</p> <p>Using <code>merge-reports</code> tool requires the following steps:</p> <ol> <li> <p>Adding a new "blob" reporter to the config when running on CI:</p> <pre lang="js" data-meta="title="playwright.config.ts""><code>export default defineConfig({ testDir: './tests', reporter: process.env.CI ? 'blob' : 'html', }); </code></pre> <p>The "blob" reporter will produce ".zip" files that contain all the information about the test run.</p> </li> <li> <p>Copying all "blob" reports in a single shared location and running <code>npx playwright merge-reports</code>:</p> <pre lang="bash"><code>npx playwright merge-reports --reporter html ./all-blob-reports </code></pre> </li> </ol> <p>Read more in <a href="https://playwright.dev/docs/test-sharding">our documentation</a>.</p> <h2>📚 Debian 12 Bookworm Support</h2> <p>Playwright now supports Debian 12 Bookworm on both x86_64 and arm64 for Chromium, Firefox and WebKit. Let us know if you encounter any issues!</p> <p>Linux support looks like this:</p> <table> <thead> <tr> <th align="left"></th> <th align="center">Ubuntu 20.04</th> <th align="center">Ubuntu 22.04</th> <th align="center">Debian 11</th> <th align="center">Debian 12</th> </tr> </thead> <tbody> <tr> <td align="left">Chromium</td> <td align="center">✅</td> <td align="center">✅</td> <td align="center">✅</td> <td align="center">✅</td> </tr> <tr> <td align="left">WebKit</td> <td align="center">✅</td> <td align="center">✅</td> <td align="center">✅</td> <td align="center">✅</td> </tr> <tr> <td align="left">Firefox</td> <td align="center">✅</td> <td align="center">✅</td> <td align="center">✅</td> <td align="center">✅</td> </tr> </tbody> </table> <h2>🌈 UI Mode Updates</h2> <ul> <li>UI Mode now respects project dependencies. You can control which dependencies to respect by checking/unchecking them in a projects list.</li> <li>Console logs from the test are now displayed in the Console tab.</li> </ul> <h2>Browser Versions</h2> <ul> <li>Chromium 116.0.5845.82</li> <li>Mozilla Firefox 115.0</li> </ul> <!-- raw HTML omitted --> </blockquote> <p>... (truncated)</p> </details> <details> <summary>Commits</summary> <ul> <li><a href=" |
|||
| 8d22874b79 |
chore(deps-dev): Bump @capacitor/core from 5.2.2 to 5.2.3 in /core (#27978)
Bumps [@capacitor/core](https://github.com/ionic-team/capacitor) from 5.2.2 to 5.2.3. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/capacitor/releases"><code>@capacitor/core</code>'s releases</a>.</em></p> <blockquote> <h2>5.2.3</h2> <h2><a href="https://github.com/ionic-team/capacitor/compare/5.2.2...5.2.3">5.2.3</a> (2023-08-10)</h2> <h3>Bug Fixes</h3> <ul> <li><strong>android:</strong> allow single input file selection from samsumg gallery (<a href="https://redirect.github.com/ionic-team/capacitor/issues/6778">#6778</a>) (<a href=" |
|||
| 8fa12fc888 |
fix(title): large title aligns with ios spec (#27969)
Issue number: resolves #27966 --------- <!-- 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 large title on iOS added bottom padding to create space between the title and the main content. However, this caused tall text to be cut off on the top. During development I also noticed that the padding value we were using does not match the iOS spec. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - The padding is now applied to the toolbar that contains the large title. The title itself is positioned absolutely so adding padding/margin to it never actually had the desired effect. What we want is space between the title and any content in sibling toolbars. All the padding on the title did was shift content within the title up to give the impression of space between the title and other content. - Adjusted the actual padding values to align with the iOS spec Note: The screenshot diffs here are correct. By adding padding to the toolbar we are increasing the height of the toolbar by 6px. As noted above, we never truly had spacing between the large title and the content since the text inside of the title was just being shifted by 6px to give the impression of spacing. Additionally, the padding values were further adjusted to match the iOS spec: | native | ionic | diff | | - | - | - | |  |  |  | - [ ] 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.4-dev.11691683954.1b6ed4bb` --------- Co-authored-by: ionitron <hi@ionicframework.com> |
|||
| 84cf0f152f |
chore: remove old comment from playwright config (#27973)
Issue number: # --------- <!-- 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. --> Shawn noted that I had an outdated comment in the `playwright.config.ts` file when working on https://github.com/ionic-team/ionic-framework/pull/27961: https://github.com/ionic-team/ionic-framework/pull/27961#pullrequestreview-1572374939 ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Remove the old comment ## 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. --> |
|||
| 28bd4ba720 |
fix(tap-click): do not error in document-less environment (#27972)
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. -->
While working on getting our starter app tests running on CI, I ran into
the following error:
```
⎯⎯⎯⎯ Unhandled Rejection ⎯⎯⎯⎯⎯
ReferenceError: document is not defined
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
❯ Module.startTapClick node_modules/@ionic/core/components/index9.js:133:15
131| };
132| const doc = document;
133| doc.addEventListener('ionGestureCaptured', cancelActive);
| ^
134| doc.addEventListener('touchstart', onTouchStart, true);
135| doc.addEventListener('touchcancel', onTouchEnd, true);
❯ node_modules/@ionic/core/components/ion-app.js:21:113
This error originated in "src/App.test.tsx" test file. It doesn't mean the error was thrown inside the file itself, but while it was running.
This error was caught after test environment was torn down. Make sure to cancel any running tasks before test finishes:
```
We are referencing `document` without any "document defined" checks.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Tap Click is only enabled if the `document` is available since we set
event listeners on the document.
## 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. -->
|
|||
| b6f43e0e72 |
test(playwright): enable github reporter, test retries (#27961)
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 team would like to explore solutions for being informed of flaky tests in a way that is not disruptive to our workflow. Currently, flaky tests fail immediately which means we have to re-run them every time. We'd like flaky tests to be automatically retried but also reported to us so we can address them in a separate PR. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Enables the Playwright GitHub reporter. This will report about flaky tests on the PR if applicable as well as in the CI results. - Enables test retries. Tests will be retried up to 2 times before failing. - Disables reporting slow tests in the GitHub reporter. Some of our tests require gesture interaction which are inherently slow but otherwise working as intended. We don't necessarily need to know about these right now. - Disables "maxFailures". Tests that can fail at most once are never detected as flaky since they are never retried. As a result, we need to disable this in order to have flaky tests be reported to us. ## 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. --> |
|||
| e9faf54d0a |
feat(toast): add shadow part for cancel button (#27921)
resolves #27920 |
|||
| 87bc207dad |
chore(input): remove generated documentation for size attribute (#27951)
Issue number: Resolves #27945 --------- <!-- 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-input` accepts a `size` attribute that implies that it will effect the size of the input under certain rules. This is not the case. The `size` attribute has no effect on the size of the `input` element since Ionic sets the input width to 100%. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Removes the documentation around the `size` attribute so that it will be removed from the Ionic Docs - Adds a task link to remove the `size` attribute in an upcoming major release ## 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. --> |
|||
| 9e9ce9420d | Merge remote-tracking branch 'origin/main' into sync-7.3-810 | |||
| 0cb37430d3 | v7.2.3 | |||
| e9fa30002b |
fix(button): hidden button is added when form is set async (#27955)
Issue number: resolves #27952 --------- <!-- 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 hidden button in `ion-button` that is responsible for submitting the form does not get added when the `form` property is set async. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - `ion-button` now checks to see if it needs to render a hidden button whenever it re-renders. This allows it to account for changes to the `type` property, `form` property, etc. Since this code can potentially run multiple times I added an extra check so we don't add multiple buttons to the form. ## 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.11691523847.1760ab58` |
|||
| 07dee74714 |
refactor(datetime): remove unused isPresented variable (#27956)
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. --> `ion-datetime` has a state variable `isPresented`, which is never set and goes unused except to add a CSS class (also unused). ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> State variable and class removed. ## 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. --> |
|||
| 3f093cec4f | Merge remote-tracking branch 'origin/main' into sync-7.3-with-main | |||
| eb19c289d6 |
fix(datetime): changing months work if partially visible (#27917)
Issue number: resolves #27913 --------- <!-- 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. --> When determining what the changed month is, we grab the element at the center of the datetime and then grab the nearest calendar month. This works fine if the datetime is fully in view, but if the center point is out of the viewport then this will return `null`. As a result, scrolling in the datetime will break. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - We now check scroll position instead of querying for DOM elements at coordinates. This allows the view to continue to update even if the entire calendar body is outside the viewport. ## 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.2-dev.11690996559.1019674a` |
|||
| 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` |
|||
| da55ab949e |
fix(modal): setCurrentBreakpoint respects animated prop (#27924)
Issue number: resolves #27923 --------- <!-- 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. --> `setCurrentBreakpoint` still animates even when `animated: false`. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - `setCurrentBreakpoint` jumps directly to the new breakpoint when `animated: false` ## 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. --> Updated design doc: https://github.com/ionic-team/ionic-framework-design-documents/pull/137 Dev build: `7.2.3-dev.11691069391.1d91d2be` |
|||
| a0b3ef02af |
fix(item-sliding): account for options added before watcher (#27915)
Issue number: resolves #27910 --------- <!-- 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 an edge case in our `ion-item-sliding` code where options can be added after the `querySelectorAll` has been run in `updateOptions` but before `watchForOptions` has been called which causes us to miss the newly created options. These options can never be shown as a result. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - `watchForOptions` is called before the initial `updateOptions` call so that we can re-run `updateOptions` in the event that options are added while that first call is running. ## 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.2-dev.11690983626.19a2a8cb` |
|||
| 9500769f11 |
fix(nav): improve reliability of swipe back gesture when quickly swiping back (#27904)
Issue number: resolves #27893 --------- <!-- 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 is another instance of https://github.com/ionic-team/ionic-framework/issues/22895. The `progressCallback` function is fires asynchronously, so it's possible for the gesture start and end callbacks to run before the animation is ever set in `progressCallback`. When this happens, the animation gets locked up. I previously fixed this in https://github.com/ionic-team/ionic-framework/pull/23527 for `ion-router-outlet`, but I did not fix it for `ion-nav`. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - If the gesture has ended by the time `progressCallback` fires, reset the animation to the beginning so it does not get locked up. ## 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.2-dev.11690896715.12338339` |
|||
| dbe6f390ef | v7.2.2 | |||
| c421d7d806 | chore(deps): update to stencil 4.0.3 (#27906) | |||
| 0c117cfe7f |
fix(select): popover uses modern form syntax (#27818)
Issue number: resolves #27071, resolves #27786 --------- <!-- 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. --> `ion-select-popover` is using the legacy syntax for `ion-checkbox` and `ion-radio`. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Migrated checkbox and radio to use the modern syntax - Updated the visual rendering tests to also check the checked state. I noticed during development that I accidentally broke the checked state, so I added tests so we can't accidentally break it again. A couple notes on other screenshot diffs: - On iOS, the item border line now extends past the radio circle. This is an intentional behavior and aligns with native iOS. Having the radio in the "start" slot is typically only done when the content in the default slot is another interactive element (like and input) and not a text label. - On MD, the control heights are smaller. When comparing with https://material-components.github.io/material-components-web-catalog/#/component/select, the new behavior seems to be correct. Both the spec and Ionic item heights are 48px. Interestingly, the radios in `ion-select-popover` have always been 48px tall, but the checkboxes were 54px. Now both the radios and checkboxes are 48px. ## 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: amandaejohnston <amandaejohnston@users.noreply.github.com> Co-authored-by: ionitron <hi@ionicframework.com> |
|||
| 0d3127ad09 |
fix(alert): radio and checkbox labels wrap to next line (#27898)
Issue number: resolves #17269
---------
<!-- 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. -->
Long radio and checkbox labels truncate with ellipsis instead of
wrapping to the next line. This makes the label hard to understand
because users cannot read the entire label.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Labels now wrap to the next line instead of truncating.
Note: Some of the screenshots may show wider alerts than before. This is
the correct behavior. When rendering text, the browser will try to
render as much text on a single line as it can. Since our alerts can
expand in width, the alert wrapper will expand in width (up to the max
width) to accommodate this text. Once the the wrapper is at the max
width, text will then wrap to the next line.
For example, you may notice the MD alert increasing to 280px in width:
|
|||
| f14c440d63 |
fix(input, textarea): input does not block floating label (#27870)
Issue number: resolves #27812 --------- <!-- 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. --> We currently have CSS to ensure the floating/stacked label is not obscured by the input/textarea when using the outline styles. However, it was discovered that this scenario can happen with any floating/stacked label not just when the input/textarea is using the outline style. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Floating/stacked labels appear on top of the input/textarea regardless of fill mode. ## 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.1-dev.11690464203.1b2b4419` --------- Co-authored-by: ionitron <hi@ionicframework.com> |
|||
| bd1910ba69 |
fix(datetime-button): render correct text when passing partial date values (#27816)
Issue number: resolves #27797 --------- <!-- 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. --> Datetime Button passes a parsed value to one of the many text formatting utilities we have, such as `getMonthAndYear`. However, developers can pass partial date values such as `2022` or `2022-04` (April 2022). According to https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#date_time_string_format, these are still valid date strings. However, the `parseDate` utility does not add fallback values. So passing `2022` will cause the `day` and `month` fields to be `undefined`. This means that `getNormalizedDate` passes `'//2022'` to the `Date` constructor. Some browsers, such as Chrome, will automatically account for the stray slashes and still return a valid date. Other browsers, such as Safari, do not do this and will either return "Invalid Date" or throw an error. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Date normalizing utility now has fallback values so we always pass in a valid date. In the example above, `getNormalizedDate` will now pass `'1/1/2022'` instead of `'//2022'` to the `Date` constructor. - Refactored other utils that use `new Date` to make use of `getNormalizedDate` since they are also impacted. Note: I added an E2E test instead of a spec test because I want to test cross-browser behavior to ensure consistency. ## 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. --> |
|||
| 06be0e5111 |
feat(alert): add htmlAttributes property for passing attributes to buttons (#27862)
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 `AlertButton` 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 |
|||
| 5ce4ec0439 |
feat(action-sheet): add htmlAttributes property for passing attributes to buttons (#27863)
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 `ActionSheetButton` interface - Passes the `htmlAttributes` to the buttons (both the buttons array and the cancelButton) - Adds two tests to verify `aria-label` and `aria-labelled-by` are passed to a button with and without the cancel role - this was done because action sheet breaks these buttons up when rendering ## Does this introduce a breaking change? - [ ] Yes - [x] No |
|||
| b8553d89f8 |
docs(popover): clarify size property (#27894)
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. --> See: https://github.com/ionic-team/ionic-framework/issues/27877 The current description does not accurately describe what `size="auto"` does. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Description clarifies that the width of the popover is set based on platform defaults. ## 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. --> |
|||
| 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 |
|||
| ba2f49b8a4 |
fix(radio): radios can be focused and are announced with group (#27817)
Issue number: resolves #27438 --------- <!-- 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 a few issues with the modern radio syntax: 1. The native radio is inside the Shadow DOM. As a result, radios are not announced with their parent group with screen readers (i.e. "1 of 3") 2. The native radio cannot be focused inside of `ion-select-popover` on Firefox. 3. The `ionFocus` and `ionBlur` events do not fire. I also discovered an issue with item: 1. Items inside of a Radio Group have a role of `listitem` which prevent radios from being grouped correctly in some browsers. According to https://bugzilla.mozilla.org/show_bug.cgi?id=1840916, browsers are behaving correctly here. The `listitem` role should not be present when an item is used in a radio group (even if the radio group itself is inside a list). ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> Most of the changes are test-related, but I broke it down per commit to make this easier to review: |
|||
| a08a5894ba |
chore(deps-dev): Bump @stencil/sass from 3.0.4 to 3.0.5 in /core (#27850)
Bumps [@stencil/sass](https://github.com/ionic-team/stencil-sass) from 3.0.4 to 3.0.5. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/stencil-sass/releases"><code>@stencil/sass</code>'s releases</a>.</em></p> <blockquote> <h2>v3.0.5</h2> <h2>What's Changed</h2> <h3>Bug Fixes</h3> <ul> <li>fix(utils): only run plugin for sass files by <a href="https://github.com/rwaskiewicz"><code>@rwaskiewicz</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/361">ionic-team/stencil-sass#361</a></li> </ul> <h3>Chores</h3> <ul> <li>chore(package): add engines to package.json by <a href="https://github.com/rwaskiewicz"><code>@rwaskiewicz</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/337">ionic-team/stencil-sass#337</a></li> <li>chore(repo): remove dependabot by <a href="https://github.com/rwaskiewicz"><code>@rwaskiewicz</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/332">ionic-team/stencil-sass#332</a></li> <li>Configure Renovate by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/330">ionic-team/stencil-sass#330</a></li> <li>chore: replace stencil slack with discord channel by <a href="https://github.com/sean-perkins"><code>@sean-perkins</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/349">ionic-team/stencil-sass#349</a></li> <li>chore(repo): update ci workflow post-stencil v4 by <a href="https://github.com/rwaskiewicz"><code>@rwaskiewicz</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/355">ionic-team/stencil-sass#355</a></li> <li>chore(ci): don't fail fast for build job by <a href="https://github.com/rwaskiewicz"><code>@rwaskiewicz</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/363">ionic-team/stencil-sass#363</a></li> <li>chore(repo): ignore .tgz files by <a href="https://github.com/rwaskiewicz"><code>@rwaskiewicz</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/362">ionic-team/stencil-sass#362</a></li> </ul> <h3>Dependency Updates</h3> <p><code>@ionic/prettier-config</code></p> <ul> <li>chore(deps): update dependency <code>@ionic/prettier-config</code> to v3.1.0 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/371">ionic-team/stencil-sass#371</a></li> <li>chore(deps): update dependency <code>@ionic/prettier-config</code> to v4 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/373">ionic-team/stencil-sass#373</a></li> </ul> <p><code>@stencil/core</code></p> <ul> <li>chore(deps-dev): bump <code>@stencil/core</code> from 3.3.0 to 3.3.1 by <a href="https://github.com/dependabot"><code>@dependabot</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/328">ionic-team/stencil-sass#328</a></li> <li>chore(deps-dev): bump <code>@stencil/core</code> from 3.3.1 to 3.4.0 by <a href="https://github.com/dependabot"><code>@dependabot</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/344">ionic-team/stencil-sass#344</a></li> <li>chore(deps): update dependency <code>@stencil/core</code> to v3.4.1 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/354">ionic-team/stencil-sass#354</a></li> <li>chore(deps): update dependency <code>@stencil/core</code> to v4 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/360">ionic-team/stencil-sass#360</a></li> </ul> <p><code>@types/node</code></p> <ul> <li>chore(deps-dev): bump <code>@types/node</code> from 20.2.5 to 20.3.0 by <a href="https://github.com/dependabot"><code>@dependabot</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/340">ionic-team/stencil-sass#340</a></li> <li>chore(deps-dev): bump <code>@types/node</code> from 20.3.0 to 20.3.1 by <a href="https://github.com/dependabot"><code>@dependabot</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/343">ionic-team/stencil-sass#343</a></li> <li>chore(deps): update dependency <code>@types/node</code> to v20.3.2 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/359">ionic-team/stencil-sass#359</a></li> <li>chore(deps): update dependency <code>@types/node</code> to v20.3.3 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/365">ionic-team/stencil-sass#365</a></li> </ul> <p><code>actions/checkout</code></p> <ul> <li>chore(deps): bump actions/checkout from 3.5.2 to 3.5.3 by <a href="https://github.com/dependabot"><code>@dependabot</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/335">ionic-team/stencil-sass#335</a></li> </ul> <p><code>actions/setup-node</code></p> <ul> <li>chore(deps): update actions/setup-node action to v3.7.0 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/367">ionic-team/stencil-sass#367</a></li> </ul> <p><code>jest</code></p> <ul> <li>chore(deps): update jest to v29 (major) by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/352">ionic-team/stencil-sass#352</a></li> <li>chore(deps): update dependency jest to v29.6.1 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/368">ionic-team/stencil-sass#368</a></li> </ul> <p><code>node</code></p> <ul> <li>chore(deps): update node.js to v20.3.1 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/353">ionic-team/stencil-sass#353</a></li> <li>chore(deps): update node.js to v20.4.0 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/369">ionic-team/stencil-sass#369</a></li> <li>chore(deps): update node.js to v20.5.0 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/375">ionic-team/stencil-sass#375</a></li> </ul> <p><code>np</code></p> <!-- raw HTML omitted --> </blockquote> <p>... (truncated)</p> </details> <details> <summary>Commits</summary> <ul> <li><a href=" |
|||
| 5d1ee1646f | chore: update to stencil 4 (#27856) | |||
| 0b8f1bc7dd |
fix(item-options): use correct safe area padding (#27853)
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. --> Item sliding options in the "start" slot use the "left" safe area padding on the end edge. This causes the padding to be added in the wrong place. During development I also discovered that the RTL padding was wrong for both start and end options. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> LTR: - `side="start"` options set "left" safe area padding on left edge of first child - `side="end"` options set "right" safe area padding on right edge of last child RTL: - `side="start"` options set "right" safe area padding on right edge of first child - `side="end"` options set "left" safe area padding on the left edge of the last child ## 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. --> | side prop/text direction | `main` | `branch` | | - | - | - | | start/LTR |  |  | | end/LTR |  |  | | start/RTL |  |  | | end/RTL |  |  | |
|||
| db29871654 | v7.2.1 | |||
| e9ee96a443 |
chore(deps-dev): Bump @playwright/test from 1.36.1 to 1.36.2 in /core (#27857)
Bumps [@playwright/test](https://github.com/Microsoft/playwright) from 1.36.1 to 1.36.2. <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>1.36.2</h2> <h3>Highlights</h3> <p><a href="https://redirect.github.com/microsoft/playwright/issues/24316">microsoft/playwright#24316</a> - [REGRESSION] Character classes are not working in globs in 1.36</p> <h3>Browser Versions</h3> <ul> <li>Chromium 115.0.5790.75</li> <li>Mozilla Firefox 115.0</li> <li>WebKit 17.0</li> </ul> <p>This version was also tested against the following stable channels:</p> <ul> <li>Google Chrome 114</li> <li>Microsoft Edge 114</li> </ul> </blockquote> </details> <details> <summary>Commits</summary> <ul> <li><a href=" |
|||
| 38626d9680 |
fix(modal): body background is reset with inline card modals (#27835)
Issue number: resolves #27830 --------- <!-- 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. --> Card modals set the body background to `black` to match iOS. This color should be removed once the final card modal has been closed. When modals were updated to work inline, the code that removed the background color was never updated to account for this. As a result, opening multiple inline card modals never removes the background color because there are always >1 modals in the DOM. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - The card modal now queries for _visible_ modals in the DOM to determine if it should remove the background color. ## 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.1-dev.11689879279.14e28634` |
|||
| 6e4919caff |
fix(item-sliding): buttons are not interactive on close (#27829)
Issue number: resolves #22722 --------- <!-- 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. --> Item Sliding Options are not disabled until after a 600ms timeout. This timeout exists to allow the close transition to complete. Without the timeout, the item sliding options disappear without a transition. I explored waiting for the `transitionend` event instead of the `setTimeout`, but the bug persisted. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - If an item sliding is closing then we add a class to the host. This class disables pointer events on all `ion-item-options` children so the buttons cannot be accidentally tapped while closing. This class is then removed after the 600ms timeout. ## 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. --> |
|||
| 5122ced9e1 |
chore(deps-dev): Bump @capacitor/core from 5.2.1 to 5.2.2 in /core (#27832)
Bumps [@capacitor/core](https://github.com/ionic-team/capacitor) from 5.2.1 to 5.2.2. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/capacitor/releases"><code>@capacitor/core</code>'s releases</a>.</em></p> <blockquote> <h2>5.2.2</h2> <h2><a href="https://github.com/ionic-team/capacitor/compare/5.2.1...5.2.2">5.2.2</a> (2023-07-19)</h2> <h3>Bug Fixes</h3> <ul> <li>add http method to prototype.open (<a href="https://redirect.github.com/ionic-team/capacitor/issues/6740">#6740</a>) (<a href=" |
