chore: do not disable fieldset legend

Author: pavelfeldman

packages/playwright-core/src/server/injected/roleUtils.ts

@@ -1005,13 +1005,12 @@ function isNativelyDisabled(element: Element) {
   return isNativeFormControl && (element.hasAttribute('disabled') || belongsToDisabledFieldSet(element));
 }
 
-function belongsToDisabledFieldSet(element: Element | null): boolean {
-  if (!element)
+function belongsToDisabledFieldSet(element: Element): boolean {
+  const fieldSetElement = element?.closest('FIELDSET[DISABLED]');
+  if (!fieldSetElement)
     return false;
-  if (elementSafeTagName(element) === 'FIELDSET' && element.hasAttribute('disabled'))
-    return true;
-  // fieldset does not work across shadow boundaries.
-  return belongsToDisabledFieldSet(element.parentElement);
+  const legendElement = fieldSetElement.querySelector(':scope > LEGEND');
+  return !legendElement || !legendElement.contains(element);
 }
 
 function hasExplicitAriaDisabled(element: Element | undefined): boolean {

tests/page/selectors-role.spec.ts

@@ -243,6 +243,48 @@ test('should support disabled', async ({ page }) => {
   ]);
 });
 
+test('should support disabled fieldset', async ({ page }) => {
+  await page.setContent(`
+    <fieldset disabled>
+      <input></input>
+      <button data-testid="inside-fieldset-element">x</button>
+      <legend>
+        <button data-testid="inside-legend-element">legend</button>
+      </legend>
+    </fieldset>
+
+    <fieldset disabled>
+      <legend>
+        <div>
+          <button data-testid="nested-inside-legend-element">x</button>
+        </div>
+      </legend>
+    </fieldset>
+
+    <fieldset disabled>
+      <div></div>
+      <legend>
+        <button data-testid="first-legend-element">x</button>
+      </legend>
+      <legend>
+        <button data-testid="second-legend-element">x</button>
+      </legend>
+    </fieldset>
+
+    <fieldset disabled>
+      <fieldset>
+        <button data-testid="deep-button">x</button>
+      </fieldset>
+    </fieldset>
+  `);
+
+  await expect.soft(page.getByTestId('inside-legend-element')).toBeEnabled();
+  await expect.soft(page.getByTestId('nested-inside-legend-element')).toBeEnabled();
+  await expect.soft(page.getByTestId('first-legend-element')).toBeEnabled();
+  await expect.soft(page.getByTestId('second-legend-element')).toBeDisabled();
+  await expect.soft(page.getByTestId('deep-button')).toBeDisabled();
+});
+
 test('should support level', async ({ page }) => {
   await page.setContent(`
     <h1>Hello</h1>