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

chore(DescriptionList): added keyboard interaction cypress test #11689

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
+21 −1
Open

chore(DescriptionList): added keyboard interaction cypress test #11689

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ea4b10b
chore(DescriptionList): added keyboard interaction cypress test
Mash707 Mar 18, 2025
9bbe6a8
added test for spacebar
Mash707 Mar 19, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 21 additions & 1 deletion packages/react-integration/cypress/integration/descriptionlist.spec.ts
View file
Original file line number Diff line number Diff line change
@@ -3,12 +3,32 @@ describe('Description List Demo Test', () => {
cy.visit('http://localhost:3000/description-list-demo-nav-link');
});

it('Verify list with help text', () => {
it('Verify list with help text triggered with mouse', () => {
cy.get('#description-list-help-text').should('exist').children('.pf-v6-c-description-list__group');
cy.get('.pf-v6-c-popover__content').should('not.exist');
cy.get(
'#description-list-help-text > :nth-child(1) > .pf-v6-c-description-list__term .pf-v6-c-description-list__text'
).click();
cy.get('.pf-v6-c-popover__content').should('exist');
cy.get('.pf-v6-c-popover__close').click();
cy.get('.pf-v6-c-popover__content').should('not.exist');
});

it('Verify list with help text triggered with enter key', () => {
cy.get('#description-list-help-text').should('exist').children('.pf-v6-c-description-list__group');
cy.get('.pf-v6-c-popover__content').should('not.exist');
cy.tab().type('{enter}');
cy.get('.pf-v6-c-popover__content').should('exist');
cy.get('.pf-v6-c-popover__close').type('{enter}');
cy.get('.pf-v6-c-popover__content').should('not.exist');
});

it('Verify list with help text triggered with spacebar', () => {
cy.get('#description-list-help-text').should('exist').children('.pf-v6-c-description-list__group');
cy.get('.pf-v6-c-popover__content').should('not.exist');
cy.tab().tab().type(' ');
cy.get('.pf-v6-c-popover__content').should('exist');
cy.get('.pf-v6-c-popover__close').type(' ');
cy.get('.pf-v6-c-popover__content').should('not.exist');
});
});

Unchanged files with check annotations Beta

View file
packages/react-core/src/components/DatePicker/DatePicker.tsx
const [selectOpen, setSelectOpen] = useState(false);
const [pristine, setPristine] = useState(true);
const [textInputFocused, setTextInputFocused] = useState(false);
const widthChars = useMemo(() => Math.max(dateFormat(new Date()).length, placeholder.length), [dateFormat]);

Check warning on line 133 in packages/react-core/src/components/DatePicker/DatePicker.tsx

GitHub Actions / Lint 

React Hook useMemo has a missing dependency: 'placeholder.length'. Either include it or remove the dependency array
const style = { [cssFormControlWidthChars.name]: widthChars, ...styleProps };
const buttonRef = useRef<HTMLButtonElement>(undefined);
const datePickerWrapperRef = useRef<HTMLDivElement>(undefined);
useEffect(() => {
setValue(valueProp);
setValueDate(dateParse(valueProp));
}, [valueProp]);

Check warning on line 144 in packages/react-core/src/components/DatePicker/DatePicker.tsx

GitHub Actions / Lint 

React Hook useEffect has a missing dependency: 'dateParse'. Either include it or remove the dependency array. If 'dateParse' changes too often, find the parent component that defines it and wrap that definition in useCallback
useEffect(() => {
if (isValidDate(valueDate)) {
applyValidators(valueDate);
}
}, [validators]);

Check warning on line 150 in packages/react-core/src/components/DatePicker/DatePicker.tsx

GitHub Actions / Lint 

React Hook useEffect has missing dependencies: 'applyValidators' and 'valueDate'. Either include them or remove the dependency array
useEffect(() => {
setPristine(!value);
if (value === '' && !pristine && !textInputFocused) {
dateIsRequired ? setErrorText(emptyDateText) : setErrorText('');
}
}, [value]);

Check warning on line 161 in packages/react-core/src/components/DatePicker/DatePicker.tsx

GitHub Actions / Lint 

React Hook useEffect has missing dependencies: 'applyValidators', 'dateIsRequired', 'dateParse', 'emptyDateText', 'errorText', 'pristine', and 'textInputFocused'. Either include them or remove the dependency array. If 'dateParse' changes too often, find the parent component that defines it and wrap that definition in useCallback
const applyValidators = (date: Date) => {
setErrorText(validators.map((validator) => validator(date)).join('\n') || '');
},
isCalendarOpen: popoverOpen
}),
[setPopoverOpen, popoverOpen, selectOpen]

Check warning on line 227 in packages/react-core/src/components/DatePicker/DatePicker.tsx

GitHub Actions / Lint 

React Hook useImperativeHandle has an unnecessary dependency: 'selectOpen'. Either exclude it or remove the dependency array
);
const createFocusSelectorString = (modifierClass: string) =>
View file
packages/react-core/src/components/Card/examples/CardWithModifiers.tsx
label={mod}
isChecked={modifiers[mod]}
onChange={(_event, checked) => {
modifiers[mod] = checked;

Check warning on line 18 in packages/react-core/src/components/Card/examples/CardWithModifiers.tsx

GitHub Actions / Lint 

Mutating a value returned from 'useState()', which should not be mutated. Use the setter function to update instead
setModifiers({ ...modifiers });
}}
/>
View file
packages/react-core/src/components/CalendarMonth/CalendarMonth.tsx
} else if (!dateProp) {
setFocusedDate(today);
}
}, [dateProp]);

Check warning on line 184 in packages/react-core/src/components/CalendarMonth/CalendarMonth.tsx

GitHub Actions / Lint 

React Hook useEffect has a missing dependency: 'focusedDate'. Either include it or remove the dependency array
useEffect(() => {
// Calendar month should not be focused on page load
if ((shouldFocus || isDateFocused) && focusedDateValidated && focusRef.current) {
focusRef.current.focus();
}
}, [focusedDate, isDateFocused, focusedDateValidated, focusRef]);

Check warning on line 191 in packages/react-core/src/components/CalendarMonth/CalendarMonth.tsx

GitHub Actions / Lint 

React Hook useEffect has a missing dependency: 'shouldFocus'. Either include it or remove the dependency array
const onMonthClick = (ev: React.MouseEvent, newDate: Date) => {
setFocusedDate(newDate);
View file
packages/react-core/src/components/BackToTop/BackToTop.tsx
const [scrollElement, setScrollElement] = useState(null);
const toggleVisible = () => {

Check warning on line 36 in packages/react-core/src/components/BackToTop/BackToTop.tsx

GitHub Actions / Lint 

The 'toggleVisible' function makes the dependencies of useEffect Hook (at line 74) change on every render. Move it inside the useEffect callback. Alternatively, wrap the definition of 'toggleVisible' in its own useCallback() Hook
if (scrollElement) {
const scrolled = scrollElement.scrollY ? scrollElement.scrollY : scrollElement.scrollTop;
if (!isAlwaysVisible) {
View file
packages/react-core/src/components/Alert/Alert.tsx
} else {
setIsDismissed(true);
}
}, [shouldDismiss, isDismissed]);

Check warning on line 167 in packages/react-core/src/components/Alert/Alert.tsx

GitHub Actions / Lint 

React Hook useEffect has missing dependencies: 'hasAnimations', 'offstageRight', and 'updateTransitionEnd'. Either include them or remove the dependency array
useEffect(() => {
const calculatedTimeout = timeout === true ? 8000 : Number(timeout);