Selector with Attribute name contain "-" do not work with Testcafe.
``` if (await Selector('div').withAttribute('act', '10').exists) {
console.log('act exists')
if (await Selector('div').withAttribute('act', '10').find('.asa').exists) {
console.log('asa exists')
}
}
Works as expected. But
``` if (await Selector('div').withAttribute('data-tooltip', 'Delete').exists) {
console.log('Datat-Tooltip exists')
if (await Selector('div').withAttribute('data-tooltip', 'Delete').find('.asa').exists) {
console.log('asa exists')
}
}
Do not work. Testcafe cannot find the Selector.
Whole script for gmail.com
.navigateTo('https://www.gmail.com')
.typeText(Selector('#identifierId'), 'xxx', {
caretPos: 0
})
.click(Selector('.RveJvd.snByac'))
.typeText(Selector('input').withAttribute('name', 'password'), 'xxx', {
caretPos: 0
})
.click(Selector('#passwordNext').find('.RveJvd.snByac'))
.click(Selector('span').withText('Invitation to join our Brand Channel').nth(1).nth(1).find('span'))
.wait(2000)
//.click(Selector('.T-I.J-J5-Ji.nX.T-I-ax7.T-I-Js-Gs.mA[data-tooltip="Delete"]').find('div'))
if (await Selector('div').withAttribute('data-tooltip', 'Delete').exists) {
console.log('Data-Tooltip exists')
if (await Selector('div').withAttribute('data-tooltip', 'Delete').find('.asa').exists) {
console.log('asa exists')
}
}
You can also check with attribute "aria-label" value "Delete". Both attributes contain "-" inside the name, both do not work. Those without "-" working perfect.
testcafe 1.2.1
node 11.14.0
OS: macOS
I cannot reproduces this behavior. This is my example:
import { Selector } from 'testcafe';
fixture `new fixture`
.page `https://devexpress.github.io/testcafe/`;
test('test', async t => {
await t.expect(Selector('meta').withAttribute('http-equiv', 'Content-Type').getAttribute('content')).eql('text/html; charset=utf-8');
});
Please make sure that your selector is correct. To check this, use聽the debug action,聽open the DevTools Console and execute the following code:
$('.T-I.J-J5-Ji.nX.T-I-ax7.T-I-Js-Gs.mA[data-tooltip="Delete"]')
I suggest to use a div selector as I use in my description. Only this can guarantee that we do not have different issues. Also the sample I added is from the gmail.com website, so everyone can test it. Testcafe cannot find any Selector with "-" but can find all selector without "-".
I've tested your scenario on gmail and figured out that this is not a bug.
Let's use, for convenience, an assertion instead of the if statement with console.log.
.expect(Selector('div').withAttribute('data-tooltip', 'Delete').find('.asa').exists).ok();
It will fail, but not because of TestCafe. If you open the DevTools Console and find this div, you will see that it has the title="Delete" attribute, but has no data-tooltip="Delete" or aria-label="Delete" attributes. They appear after the first hover on this div and the title attribute is removed. For this reason, the following code will pass:
.hover(Selector('div').withAttribute('title', 'Delete').nth(1))
.expect(Selector('div').withAttribute('data-tooltip', 'Delete').find('.asa').exists).ok();
This thread has been automatically locked since it is closed and there has not been any recent activity. Please open a new issue for related bugs or feature requests. We recommend you ask TestCafe API, usage and configuration inquiries on StackOverflow.
Most helpful comment
I've tested your scenario on gmail and figured out that this is not a bug.
Let's use, for convenience, an assertion instead of the
ifstatement withconsole.log.It will fail, but not because of TestCafe. If you open the DevTools Console and find this
div, you will see that it has thetitle="Delete"attribute, but has nodata-tooltip="Delete"oraria-label="Delete"attributes. They appear after the first hover on thisdivand thetitleattribute is removed. For this reason, the following code will pass: