K6 browser trying to use a upload a file to a dropzoone

Grafana k6
1

I’m writing a Browser Test where I have to click a “Add Files” button and then select a file i want to upload and it populates in a dropzone. In playwright I am able to simply use setInputFiles()

await this.page.setInputFiles(“input[class=‘dz-hidden-input’]”,filepath)

Is there an equivalent solution for k6?

2

Hi @paul424242, welcome to the community forum!

setInputFiles() is not implemented yet. source code

You can achieve something like that:

function setInputFiles (page, selector, filename, content, mime) {
  page.evaluate((selector, filename, content, mime) => {
      const dt = new DataTransfer();
      const blob = new Blob([content], { type: mime });
      const file = new File([blob], filename, { type: mime });
      dt.items.add(file)
      const input = document.querySelector(selector);
      input.files = dt.files;
      input.dispatchEvent(new Event('input', { 'bubbles': true }));
      input.dispatchEvent(new Event('change', { 'bubbles': true }));
  }, selector, filename, content, mime);
}

export default async function () {
  const page = browser.newPage();
  try {
    await page.goto('http://localhost:9080');
    setInputFiles(page,'input[class="dz-hidden-input"]', 'myfilename.txt','This is the content of the file' , 'text/plain');
    sleep(20);
  } finally {
    page.close();
  }
}

I hope this answer help you.

2 Likes
3

@bandorko Thank you so much for the quick response! That worked perfectly.

2 Likes