Description of problem: Since we move to the new UI, many elements have no proper selector like 'data-test-id' or 'data-test' or 'id'. Why this is a problem to qe: 1. it's hard to locate the element while writing tests. 2. tests is more flaky. 3. tests is more fragile when UI changed. examples about elements lack proper selector: 1. edit buttons on vm tabs: scheduling tab 2. `id="pf-select-toggle-id-2098"` is used for dropdown menu, which is not usable. such as disk source dropdown while creating the VM, add nic/disk modal. Version-Release number of selected component (if applicable): OCP 4.11 How reproducible: Steps to Reproduce: 1. 2. 3. Actual results: Expected results: Additional info:
notes for reviewer: in kubevirt plugin we declare our test id to be "data-test-id" [1] [1] https://github.com/kubevirt-ui/kubevirt-plugin/blob/main/jest-setup.ts#L7 Vojtech hi, should we use a more common name like 'data-testid', do you know of any RH guidlines, what is used by other RH projects ?
notes for verifying: tests should always use byTestID, in cases this is not posible it should be clear why not using a test id.
Hi, Kubevirt dynamic plugin already uses '@testing-library/dom' and '@testing-library/jest-dom' together with Jest. > import { configure } from '@testing-library/dom'; This applies to "native" test approach when you have unit tests executed by Jest in jsdom env. > import { configure } from '@testing-library/react'; This can be used to tweak React-specific wrapper of the testing library. Since we have React components, I'd go with this one. > should we use a more common name like 'data-testid', do you know of any RH guidlines, what is used by other RH projects ? We can use "data-test-id" attribute to identify DOM elements that we need to reference in our tests (either unit/Jest or e2e/Cypress tests). I'd advise against using the standard "id" attribute because that one is supposed to be unique within the DOM tree. As for RH guidelines, I'm only aware of the Open UI Automation (OUIA) spec which is part of PatternFly: https://www.patternfly.org/v4/developer-resources/open-ui-automation/
> > import { configure } from '@testing-library/react'; > > This can be used to tweak React-specific wrapper of the testing library. Since we have React components, I'd go with this one. hmm, @testing-library/react uses 'data-testid' [1] [1] https://github.com/testing-library/dom-testing-library/blob/45830f580ced3ae5337af9ace4a9bd65067dfe5c/src/config.ts#L13 my vote is to move the 'data-testid' but I'm fine with the current 'data-test-id' we use today too.
Since the problem described in this bug report should be resolved in a recent advisory, it has been closed with a resolution of ERRATA. For information on the advisory (Important: OpenShift Virtualization 4.11.0 Images security and bug fix update), and where to find the updated files, follow the link below. If the solution does not work for you, open a new bug report. https://access.redhat.com/errata/RHSA-2022:6526