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

[selectors] Consider adding a selector to match the element that has shadow DOM #9712

Open
mantou132 opened this issue Dec 15, 2023 · 2 comments
Labels
selectors-4 Current Work

Comments

@mantou132
Copy link

mantou132 commented Dec 15, 2023

Add the following code to remind users that the undefined elements are used:

:not(:defined) {
  display: block;
  font-size: 0;
}
:not(:defined) * {
  display: none;
}
:not(:defined)::before {
  font-size: 1rem;
  display: block;
  content: 'The element is not defined';
  padding: 1em;
  text-align: center;
  background: gray;
}
Screenshot 2023-12-15 at 12 54 46

But now we have Declarative Shadow DOM, we can no longer determine which elements may have layout problems(demo), to find these elements, it is suggested to add a pseudo class::attached:

:not(:defined, :attached) {
  display: block;
  font-size: 0;
}
:not(:defined, :attached) * {
  display: none;
}
:not(:defined, :attached)::before {
  font-size: 1rem;
  display: block;
  content: 'The element is not defined';
  padding: 1em;
  text-align: center;
  background: gray;
}
@Loirooriol
Copy link
Contributor

This could make sense for open shadow trees, but exposing closed ones seems to defeat the closedness?

@mantou132
Copy link
Author

Yes, it should only work with open shadow tree

@fantasai fantasai changed the title [css-selectors] Consider adding a selector to match the element that has shadow DOM [selectors] Consider adding a selector to match the element that has shadow DOM Jan 9, 2024
@fantasai fantasai added the selectors-4 Current Work label Jan 9, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
selectors-4 Current Work
Projects
None yet
Development

No branches or pull requests

3 participants