api = loadApi({ input: inputApiKey, invalidation })
url = "https://webdriver.io"
{
let win = await api.windows.create({
url,
focused: true,
width: 800,
height: 600
});
const close = async () => {
if (win) {
const id = win.id;
win = null;
await api.windows.remove(id);
}
};
invalidation.then(close);
try {
const windowId = win.id;
const tabId = win.tabs[0].id;
const { status, result, error } = await api.custom.injectScript(
{ tabId },
{
// We need to serialize the scraping function - it will be sent to the page itself and executed there:
func: extractContentFromWebdriverIO.toString(),
args: []
}
);
if (status === "error") {
throw new Error(JSON.stringify(error));
}
return htl.html`<ul>${result.map(
({ title, description }) =>
htl.html`<li><strong>${title}</strong> ${description}</li>`
)}</ul>`;
} catch (error) {
console.error(error);
return htl.html`<div>ERROR! ${JSON.stringify(error.message)}<div>`;
} finally {
await close();
}
}
async function extractContentFromWebdriverIO() {
async function main() {
const list = [
...document.body.querySelectorAll(".container .feature_G9wp")
];
return list.map((elm) => {
const title = elm.querySelector("h3")?.innerHTML;
const description = elm.querySelector("p")?.innerHTML;
return {
title,
description
};
});
}
if (document.loaded) {
return main();
} else {
return new Promise((resolve, reject) => {
document.addEventListener("DOMContentLoaded", async (ev) => {
try {
resolve(await main());
} catch (e) {
reject(e);
}
});
});
}
}
import { loadApi, newApiKeyInput } from "@kotelnikov/webrun-devtools"
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
