如何使用带有 JS 的剧作家在 iframe 中上传图片？

【问题标题】：How to upload an image inside iframe using playwright with JS?如何使用带有 JS 的剧作家在 iframe 中上传图片？
【发布时间】：2022-11-18 01:29:19
【问题描述】：

我使用了以下步骤和方法上传功能发生在 iframe 内部
期待您的建议

const mFrame=page.frameLocator('iframe[name="entity_browser_iframe_eb_banner_slides"]').locator('html');

await mFrame.locator("//a[contains(text(),'Upload')]").click(); //clicking upload button

await mFrame.setInputFiles('//*[@id="edit-upload"]/div',filepath); //uploading image

运行上面的代码后，我得到以下错误

frame.setInputFiles: Error: Node is not an HTMLInputElement

【问题讨论】：

标签： playwright playwright-test

【解决方案1】：

实际上，您无需单击任何内容即可工作。

假设我有这样的 HTML：

<div>
    <input name="files" id="files" type="file" size="80" />
    <input id="submit" value="Upload Document" />
</div>

我可以简单地执行以下操作来设置要在提交表单时上传的文件：

const btnUpload = page.locator('#files');
const btnSubmit = page.locator('#submit');

await btnUpload.setInputFiles(fileName);
await btnSubmit.click();

那应该对您有帮助，但是如果在调整为在您的 iframe 中使用时它不起作用，请发布您的 html。

编辑：在没有看到你的 html 的情况下，你可能可以摆脱这个：

const frame = page.frameLocator('iframe[name="entity_browser_iframe_eb_banner_slides"]');
await frame.setInputFiles('#edit-upload', filepath);

【讨论】：