How to use the @percy/agent/dist/utils/sdk-utils.agentJsFilename function in @percy/agent

} finally {
    // restore replaced canvases
    for (const { image, canvas } of replacements) {
      image.parentElement.replaceChild(canvas, image);
    }

    // restore element visibility
    document.head.removeChild(styleElement);
    remove(['body'], 'hideInPercy');
    remove(show, 'showInPercy');
    remove(hide, 'hideInPercy');
  }
}

export const takePercySnapshotWithAgent = `
  ${readFileSync(agentJsFilename(), 'utf8')}

  return (${takePercySnapshot.toString()}).apply(null, arguments);
`;

export async function percySnapshot(browser: any, name: string, options: any = {}) {
  if (!browser) {
    throw new Error("WebdriverIO 'browser' object must be provided.");
  }
  if (!name) {
    throw new Error("'name' must be provided. In Mocha, this.test.fullTitle() is a good default.");
  }

  if (! await isAgentRunning()) {
     return
  }

  await browser.execute(fs.readFileSync(agentJsFilename()).toString(), []);

  // WebdriverIO v4 returns an object with the return value from the execute command
  // WebdriverIO v5 returns whatever is returned from the execute command
  const browserResult: any = await browser.execute((name: string, options: any) => {
    var percyAgentClient = new PercyAgent({ handleAgentCommunication: false });

    return percyAgentClient.snapshot(name, options);
  }, name, options);

  const resultIsString = typeof browserResult === "string";
  const domSnapshot = resultIsString ? browserResult : browserResult.value;

  await postDomSnapshot(name, domSnapshot, await browser.getUrl(), options);
}