Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor(checkbox): remove legacy property and support for legacy syntax #29043

Merged
merged 8 commits into from Feb 14, 2024

Conversation

liamdebeasi
Copy link
Contributor

@liamdebeasi liamdebeasi commented Feb 13, 2024

Issue number: internal


What is the current behavior?

In Ionic Framework v7, we simplified the checkbox syntax so that it was no longer required to be placed inside of an ion-item. We maintained backwards compatibility by adding a legacy property which allowed it to continue to be styled properly when written in the following way:

<ion-item>
  <ion-label>Label</ion-label>
  <ion-checkbox></ion-checkbox>
</ion-item>

While this was supported in v7, console warnings were logged to notify developers that they needed to update this syntax for the best accessibility experience.

What is the new behavior?

  • Removes the legacy property and support for the legacy syntax. Developers should follow the migration guide in the checkbox documentation to update their apps. The new syntax requires a label or aria-label on ion-checkbox :
    <ion-item>
      <ion-checkbox>Label</ion-checkbox>
    </ion-item>
  • Removes the legacy tests under checkbox/test/legacy/ and all related screenshots
  • Removes the checkbox usage in item/test/disabled, item/test/legacy/disabled

Does this introduce a breaking change?

  • Yes
  • No
  1. Developers have had console warnings when using the legacy syntax since the v7 release. The migration guide for the new checkbox syntax is outlined in the Checkbox documentation.
  2. This change has been documented in the Breaking Changes document with a link to the migration guide.

BREAKING CHANGE:

The legacy property and support for the legacy syntax, which involved placing an ion-checkbox inside of an ion-item with an ion-label, have been removed from checkbox. For more information on migrating from the legacy checkbox syntax, refer to the Checkbox documentation.

liamdebeasi and others added 6 commits February 13, 2024 14:28
This PR removes the tests for the legacy checkbox syntax. A separate PR
will be used to remove the implementation for the legacy syntax.

---------

Co-authored-by: ionitron <hi@ionicframework.com>
@github-actions github-actions bot added the package: core @ionic/core package label Feb 13, 2024
@liamdebeasi liamdebeasi changed the title Fw 3100 refactor(checkbox): remove legacy property and support for legacy syntax Feb 13, 2024
This pull request includes the changes to remove the `legacy` property
for the checkbox as part of
#29043. That pull
request specifically focuses on updating tests to remove any legacy
checkbox usage. The internal ticket suggested separating these changes
into individual pull requests. Please refer to the mentioned pull
request for a detailed description of the combined changes from both
pull requests. This will be merged into that pull request upon approval.
@github-actions github-actions bot added package: angular @ionic/angular package package: vue @ionic/vue package labels Feb 14, 2024
@liamdebeasi liamdebeasi marked this pull request as ready for review February 14, 2024 17:29
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Optional: Might be good to screenshot only the content, and/or remove the "toggle" footer, so there's not so much white space in these.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good thought. I can definitely clean some of these screenshots up once the remaining form controls have been updated 👍

@liamdebeasi liamdebeasi merged commit fb5ae5b into feature-8.0 Feb 14, 2024
44 checks passed
@liamdebeasi liamdebeasi deleted the FW-3100 branch February 14, 2024 17:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: angular @ionic/angular package package: core @ionic/core package package: vue @ionic/vue package
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants