Доступ к расширению API запрещен в Jest PuppeteervaluHandle - PullRequest
1 голос
/ 17 июня 2019

Моя архитектура расширения:

  1. Фоновая страница хранит состояние расширения. Я думаю, что это хорошо, поскольку сохранение состояния в одном месте облегчает отладку.
  2. Сценарии содержимого выполняют некоторые действия на веб-странице в зависимости от состояния расширения.
  3. Каждый раз, когда пользователь обновляет состояние расширения через страницу настроек, они обновляются на фоновой странице, которая затем отправляет сообщение в сценарии содержимого для соответствующего обновления своих данных.

Через Jest + Puppeteer я собираюсь смоделировать различные изменения в состоянии и протестировать их. Для этого вот моя справочная страница MCVE:

chrome.runtime.onInstalled.addListener(function (details) {
    if (details.reason === "install") {
        console.log("installed at " + new Date());
    }
});

window.sendMessage = function () {
    chrome.tabs.query({}, function (tabs) {
        if (chrome.runtime.lastError) {
            console.log(chrome.runtime.lastError.message);
        }

        console.log(tabs);
        if (!tabs) return;

        for (const tab of tabs) {
            if (tab.url && /^https:\/\//.test(tab.url)) {
                chrome.tabs.sendMessage(tab.id, { "message": "hey" });
            }
        }

    });
};
console.log("defined fn " + window.sendMessage)

и следующие test.js

/**
 * Wait for given milliseconds
 * @param {Number} milliseconds to wait
 */
function sleep(milliseconds) {
    return new Promise((resolve) => {
        setTimeout(() => resolve(), milliseconds);
    });
}

// some random webpages
const testURLs = [
    {
        url:
            "https://stackoverflow.com/questions/50990292/"
            + "using-octal-character-gives-warning-multi-character-character-constant",
    },
    {
        url:
            "https://serverfault.com/questions/971011/"
            + "how-to-check-if-an-active-directory-server-is-reachable-from-an-ubuntu-apache-ph",
    },
];

const usablePages = [],
    JEST_TIMEOUT = 60000;

/*
 * add this since jest's default timeout is 5s only; Loading a page might take longer
 */
jest.setTimeout(JEST_TIMEOUT);

async function getBackgroundPage() {
    const targets = await browser.targets(),
        backgroundPageTarget = targets.find(
            target => target.type() === "background_page",
        ),
        backgroundPage = await backgroundPageTarget.page();

    return backgroundPage;
}

async function sendMsgs() {
    const bgPage = await getBackgroundPage();
    await bgPage.evaluateHandle(`window.sendMessage();`);
}

beforeAll(async () => {
    for (const testURL of testURLs) {
        const usablePage = await browser.newPage();
        await usablePage.setViewport({ width: 1920, height: 1080 });
        await usablePage.goto(testURL.url);
    }
    // for debugging, so you can open console and check in 15secs
    await sleep(15000);
    sendMsgs();
    await sleep(15000);
});

it("simple test", function () {
    expect(2).toBe(2);
});

Этот код дает мне следующее runtime.lastError:

Доступ к расширению API запрещен.

Я уже объявил разрешение ["tabs", "<all_urls>"] в своем manifest.json. Что еще я могу сделать, чтобы решить эту проблему?

Конфиг моего шутника:

const pathToExtension = require("path").join(__dirname, "dist");

module.exports = {
    launch: {
        headless: false,
        args: [
            `--disable-extensions-except=${pathToExtension}`,
            `--load-extension=${pathToExtension}`,
            "--single-process",
        ],
        sloMo: 250,
    },
};
...