Как изменить фон about:newtab

В настоящее время надстройки WebExtensions не могут изменить about:newtab

Это ошибка, которую вы получаете, когда страница, на которую вы пытаетесь внедрить, не соответствует шаблон соответствия или не может быть выражен в виде шаблона соответствия (т. е. URL-адрес должен быть представлен в виде шаблон соответствия, даже если вы не указали шаблон соответствия). Шаблоны соответствия должны иметь схему, которая является одной из http, https, file, ftp или app. Ошибка, которую вы видите, является результатом отсутствия проверки значения runtime.lastError в функции обратного вызова в tabs.insertCSS(), если ошибка является ожидаемой при попытке внедрить код или CSS на страницу about:*.

Документация MDN довольно специфична в отношении невозможности использования tabs.insertCSS() с любой из about:* страниц (выделено мной):

Вы можете внедрить CSS только в страницы, URL-адрес которых может быть выражен с использованием шаблона соответствия: это означает, что его схема должна быть одной из «http», «https», «file», «ftp». Это означает, что вы не можете внедрить CSS ни на одну из встроенных страниц браузера, например about:debugging, about:addons или на страницу, которая открывается при открытии новой пустой вкладки [about:newtab].

Будущее:
Chrome имеет ключ manifest.json chrome_url_overrides, который позволяет переопределить любой из: bookmarks, history или newtab. Похоже, что Firefox поддерживает этот ключ manifest.json это "возможно".

Альтернативы:
Можно переопределить страницу новой вкладки с помощью другие типы надстроек Firefox.

Вы можете использовать WebExtensions, чтобы обнаружить, что вкладка изменила свой URL-адрес на about:newtab, и перенаправить вкладку на страницу по вашему выбору.

Использование tabs.insertCSS() или tabs.executeScript() для вкладок, как правило

Если вы используете tabs.insertCSS() или tabs.executeScript() в ситуации, когда вкладка обычно содержит обычный URL, но может быть about*: (или chrome:* схема в Chrome) (например, кнопка browser_action), вы можете обработать ошибку. со следующим кодом (протестировано и работает как в Firefox WebExtensions, так и в Chrome):

function handleExecuteScriptAndInsertCSSErrors(tabId){
    if(chrome.runtime.lastError){
        let message = chrome.runtime.lastError.message;
        let isFirefox = window.InstallTrigger?true:false;
        let extraMessage = tabId ? 'in tab ' + tabId + '.' : 'on this page.';
        if((!isFirefox && message.indexOf('Cannot access a chrome:') > -1) //Chrome
            ||(isFirefox && message.indexOf('No window matching') > -1) //Firefox
        ){
            //The current tab is one into which we are not allowed to inject scripts.
            //  You should consider alternatives for informing the user that your extension
            //  does not work on a particular page/URL/tab.
            //  For example: For browser_actions, you should listen to chrome.tabs events
            //  and use use browserAction.disable()/enable() when the URL of the
            //  active tab is, or is not, one for which your add-on can operate.
            //  Alternately, you could use a page_action button.
            //In other words, using a console.log() here in a released add-on is not a good
            //  idea, but works for examples/testing.
            console.log('This extension, ' + chrome.runtime.id 
                        + ', does not work ' + extraMessage);
        } else {
            // Report the error
            if(isFirefox){
                //In Firefox, runtime.lastError is an Error Object including a stack trace.
                console.error(chrome.runtime.lastError);
            }else{
                console.error(message);
            }
        }
    }
}

Затем вы можете изменить свой код changeBackground() на:

function changeBackground(tabId) {
    chrome.tabs.insertCSS( tabId, {
        code: "body { border: 20px dotted pink; }"
    }, handleExecuteScriptAndInsertCSSErrors.bind(null,tabId));
}

Очевидно, что такое изменение кода не позволит вам изменить фон на странице about:newtab.