How to find an element by using Or in the locator?

Question

I have 2 very similar elements one different pages that I need to test:

<input name="myName">
<input name="name">

In my code I tried to find the input element using Or (||) keyword, but that did Not work.

Can this be done without xpath, only by using CSS expression?

this._nameInput = page.locator(
    'input[name="name"]' || 'input[name*="Name"]'
)

Answer 1

You can use the or method:

lowercase = page.locator('input[name="name"]')
wildcard = page.locator('input[name*="Name"]');
this._nameInput = lowercase.or(wildcard);