mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-09-29 16:57:00 +08:00
Display option to force :open pseudo class
Bug: 383157184 Change-Id: Ib12a89c8914fe4ff2761dfea823979b8966d4fed Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6164989 Reviewed-by: Philip Pfaffe <pfaffe@chromium.org> Auto-Submit: Eric Leese <leese@chromium.org> Commit-Queue: Eric Leese <leese@chromium.org>
This commit is contained in:
committed by
Devtools-frontend LUCI CQ
parent
ec4c0fcc20
commit
be9c8f491f
@@ -16,24 +16,10 @@ describeWithMockConnection('ElementStatePaneWidget', () => {
|
||||
let view: Elements.ElementStatePaneWidget.ElementStatePaneWidget;
|
||||
|
||||
const pseudoClasses = [
|
||||
'enabled',
|
||||
'disabled',
|
||||
'valid',
|
||||
'invalid',
|
||||
'user-valid',
|
||||
'user-invalid',
|
||||
'required',
|
||||
'optional',
|
||||
'read-only',
|
||||
'read-write',
|
||||
'in-range',
|
||||
'out-of-range',
|
||||
'visited',
|
||||
'link',
|
||||
'checked',
|
||||
'indeterminate',
|
||||
'placeholder-shown',
|
||||
'autofill',
|
||||
'enabled', 'disabled', 'valid', 'invalid', 'user-valid',
|
||||
'user-invalid', 'required', 'optional', 'read-only', 'read-write',
|
||||
'in-range', 'out-of-range', 'visited', 'link', 'checked',
|
||||
'indeterminate', 'placeholder-shown', 'autofill', 'open',
|
||||
];
|
||||
|
||||
beforeEach(() => {
|
||||
@@ -165,6 +151,7 @@ describeWithMockConnection('ElementStatePaneWidget', () => {
|
||||
'read-only',
|
||||
'placeholder-shown',
|
||||
'autofill',
|
||||
'open',
|
||||
],
|
||||
);
|
||||
});
|
||||
@@ -241,7 +228,7 @@ describeWithMockConnection('ElementStatePaneWidget', () => {
|
||||
it('Shows the specific pseudo-classes for select', async () => {
|
||||
await assertExpectedPseudoClasses(
|
||||
'select',
|
||||
['disabled', 'valid', 'invalid', 'user-valid', 'user-invalid', 'required', 'read-write'],
|
||||
['disabled', 'valid', 'invalid', 'user-valid', 'user-invalid', 'required', 'read-write', 'open'],
|
||||
);
|
||||
});
|
||||
|
||||
@@ -342,6 +329,7 @@ describeWithMockConnection('ElementStatePaneWidget', () => {
|
||||
'autofill',
|
||||
'checked',
|
||||
'indeterminate',
|
||||
'open',
|
||||
],
|
||||
false,
|
||||
['type', 'checkbox'],
|
||||
@@ -360,6 +348,7 @@ describeWithMockConnection('ElementStatePaneWidget', () => {
|
||||
'autofill',
|
||||
'checked',
|
||||
'indeterminate',
|
||||
'open',
|
||||
],
|
||||
false,
|
||||
['type', 'radio'],
|
||||
|
||||
@@ -64,6 +64,7 @@ enum SpecificPseudoStates {
|
||||
INDETERMINATE = 'indeterminate',
|
||||
PLACEHOLDER_SHOWN = 'placeholder-shown',
|
||||
AUTOFILL = 'autofill',
|
||||
OPEN = 'open',
|
||||
}
|
||||
|
||||
export class ElementStatePaneWidget extends UI.Widget.Widget {
|
||||
@@ -218,6 +219,7 @@ export class ElementStatePaneWidget extends UI.Widget.Widget {
|
||||
SpecificPseudoStates.PLACEHOLDER_SHOWN, createElementStateCheckbox(SpecificPseudoStates.PLACEHOLDER_SHOWN));
|
||||
this.specificPseudoStateDivs.set(
|
||||
SpecificPseudoStates.AUTOFILL, createElementStateCheckbox(SpecificPseudoStates.AUTOFILL));
|
||||
this.specificPseudoStateDivs.set(SpecificPseudoStates.OPEN, createElementStateCheckbox(SpecificPseudoStates.OPEN));
|
||||
|
||||
this.specificPseudoStateDivs.forEach(div => {
|
||||
elementSpecificContainer.appendChild(div);
|
||||
@@ -415,6 +417,12 @@ export class ElementStatePaneWidget extends UI.Widget.Widget {
|
||||
hideSpecificCheckbox(SpecificPseudoStates.AUTOFILL, true);
|
||||
}
|
||||
|
||||
if (isElementOfTypes(node, ['input', 'select', 'dialog', 'details'])) {
|
||||
hideSpecificCheckbox(SpecificPseudoStates.OPEN, false);
|
||||
} else {
|
||||
hideSpecificCheckbox(SpecificPseudoStates.OPEN, true);
|
||||
}
|
||||
|
||||
this.specificHeader.hidden = showedACheckbox ? false : true;
|
||||
this.updateElementSpecificStatesTableForTest();
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user