问题
I open two modals in my testing, and I want to be able to click on the "OK" button in the second modal (the second selected element in the below html).
My current code is :
import { waitForReact } from 'testcafe-react-selectors';
import { Selector } from 'testcafe';
fixture `App tests`
.page('http://localhost:3000/')
.beforeEach(async () => {
await waitForReact();
});
test('Can open and accept all pop ups', async t => {
//open first modal
await t
.click('#LayerAddingPopUpButtonID');
//select OK button from first modal
const modalOKButton = Selector('div.ant-modal')
.find('div.ant-modal-footer')
.find('button.ant-btn-primary');
//click OK button from first modal
await t
.expect(modalOKButton.with({visibilityCheck: true}).exists)
.ok({timeout: 30000})
.hover(modalOKButton)
.click(modalOKButton);
//open second modal
await t
.click('#LayerDeletingPopUpButtonID');
//select OK button from second modal
const secondModalOKButton = Selector(??);
});
The html I'm working with is the following. I'm trying to select the second OK button:
回答1:
did you try using nth
?
const modalOKButton = Selector('div.ant-modal').nth(1)
.find('div.ant-modal-footer')
.find('button.ant-btn-primary');
or maybe try using selector by aria-labelledby
const modalOKButton = Selector("[aria-labelledby='rcDialogTitle1']")
.find('div.ant-modal-footer')
.find('button.ant-btn-primary');
来源:https://stackoverflow.com/questions/55365534/select-ok-button-from-nth-modal-opened-in-testcafe