Question

我在操纵木偶戏时遇到问题。我想将添加的项目删除到表单。例如，我有一个表单，并添加了一些虚假数据（“示例” ）。我要删除此“示例”，无论它位于什么位置都没有关系。我只想删除此“示例”。

因此，这意味着puppeteer会添加它，并在下一步将其删除。

我已经尝试过：

// fake data
const metadatatest = {
text: 'example,
}


describe('Should be navigate through details', () => {
it('can navigate through detail', async () => {

// this adds fake data successfully

await page.waitForSelector('[data-testid="appCard"]')
await page.click('[data-testid="appCardDetails"]')
await page.waitForSelector('[data-testid="overviewSectionMetadataForm"]')
await page.click('[data-testid="overviewSectionMetadataEditButton"]')
//await page.$eval('[data-testid="metadataInput"]', el => el.value = 'example')
await page.type('[data-testid="metadataInput"]', metadatatest.text)
await page.waitForSelector('[data-testid="metadataInput"]')
await Promise.all([
  page.click('[data-testid="overviewSectionMetadataEditButton"]'),
]);

// I want to delete this

})
})

我也尝试使用

await page.keyboard.press('Backspace')
await page.keyboard.press('Clear')
await page.keyboard.press('Delete')

但没有运气。

请帮忙！

Answer 1

所以您要问的是从输入字段中清除文本，我能正确阅读吗？ Puppeteer没有内置的方法，但是我找到了一种解决方法，可以为您解决这个问题。

首先，您需要在要清除的输入字段上单击3次。这是对该元素中输入的所有文本的全选操作：

await page.click(selector, { clickCount: 3 });

现在您可以使用以前的尝试来清除文本：

await page.keyboard.press('Backspace');

更新1：
您要清除的最终代码，然后将所需文本输入到输入字段中，应该像这样：

await page.click('[data-testid="metadataInput"]', { clickCount: 3 });
await page.keyboard.press('Backspace');
await page.type('[data-testid="metadataInput"]', metadatatest.text);

如何将添加的项目删除到人偶中的表单

1 个答案: