Я успешно разрабатывал интеграционные тесты с Puppeteer для приложения Nodejs с Reactjs, но столкнулся с проблемой, когда хочу протестировать ввод разных входных данных.
У меня есть вход для заголовка, другой для темы, тела электронной почты и получателя электронной почты, но все они являются входами без привязанного к ним класса, вместо этого у них есть имя, привязанное к ним, например так:
<input name = "title"...
<input name = "subject"...
<input name = "body"...
и так далее.
Могу ли я зафиксировать этот атрибут name, и если да, то каков его синтаксис, чтобы я мог проверить ввод в эти входные данные.
Это мой тест на данный момент:
describe('And using valid inputs', async () => {
beforeEach(async () => {
await page.type('input', 'My Title')
})
test('Submitting takes user to review screen', async () => {
})
test('Submitting then saving adds survey to index page', async () => {
})
})
describe("And using invalid inputs", async () => {
beforeEach(async () => {
await page.click("form button.teal");
});
test("the form shows an error message", async () => {
const inputError = await page.getContentsOf(".red-text");
expect(inputError).toEqual("You must provide a value");
});
});
Как видите, я успешно воспользовался элементом form и классами для недопустимых входных данных, но теперь мне нужно иметь возможность различать типы входных данных, чтобы успешно завершить правильный ввод входных элементов, это само по себе await page.type('input', 'My Title') Я не думаю будет работать. Как Puppeteer узнает, какой тип ввода я имею в виду?





Вы можете рассматривать name как атрибут. И используйте CSS-селектор, используя этот атрибут, чтобы соответствовать вводу.
await page.type('INPUT[name=err_email]', 'My Title')