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.

Sign up for GitHub

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

Jump to bottom

:enabled / :disabled do not correctly match inputs inside a disabled fieldset #97

Open
aethr opened this issue Oct 5, 2023 · 0 comments
Open

:enabled / :disabled do not correctly match inputs inside a disabled fieldset #97

aethr opened this issue Oct 5, 2023 · 0 comments

Comments

@aethr
Copy link

aethr commented Oct 5, 2023

Related to jsdom/jsdom#3603

Expected behaviour

The :disabled pseudo-class should match all disabled inputs, including those that are disabled because a parent <fieldset> is disabled. :enabled should behave similarly, but in reverse. This works correctly in browsers.

JSBin with example :disabled behaviour: https://jsbin.com/woguyoguze/edit?html,console,output

Actual behavior

The :disabled selector only appears to select elements that are disabled directly.

Reproduction

jsdom: 22.1.0
nwsapi: 2.2.5

import { JSDOM } from 'jsdom';

const dom = new JSDOM(`
<body>
  <fieldset disabled>
    <input id="not-focusable-in-fieldset">
  </fieldset>
  <input id="not-focusable-outside" disabled>
  <input id="focusable">
</body>
`, {});

const docBody = dom.window.document.body;

if (docBody.querySelector('input:enabled').id !== 'focusable') {
  console.log(':enabled in fieldset: incorrect');
}
if (docBody.querySelector('input:not(:enabled)').id !== 'not-focusable-in-fieldset') {
  console.log(':not(:enabled) in fieldset: incorrect');
}

if (docBody.querySelector('input:disabled').id !== 'not-focusable-in-fieldset') {
  console.log(':disabled in fieldset: incorrect');
}
if (docBody.querySelector('input:not(:disabled)').id !== 'focusable') {
  console.log(':not(:disabled) in fieldset: incorrect');
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@aethr