How to use the webextension-polyfill.extension function in webextension-polyfill

.catch((err) => {
        console.error('runtime.openOptionsPage() failed, opening options page in tab instead.', err)
        // brave: fallback to opening options page as a tab.
        browser.tabs.create({ url: browser.extension.getURL('dist/options/options.html') })
      })
  })

import browser from 'webextension-polyfill';
import { getFaviconUrl } from '../utils/url';
import { fetchBookmarks } from '../utils/hatebu';
import getMessage from '../utils/i18n';

const openOptionCommand = {
  id:         'hatena-options',
  label:      `${getMessage('hatena_options_hint')}`,
  type:       'command',
  args:       ['open-options'],
  faviconUrl: browser.extension.getURL('images/options.png'),
};

export default async function candidates(q, { maxResults } = {}) {
  const { hatenaUserName } = await browser.storage.local.get('hatenaUserName');
  if (!hatenaUserName && maxResults !== 0) {
    return {
      items: [openOptionCommand],
      label: `${getMessage('hatena_bookmarks_hint')}`,
    };
  }

  // To make search efficient ...
  const bookmarks = await fetchBookmarks(hatenaUserName);
  const results = [];
  for (let i = bookmarks.length - 1; i >= 0; i -= 1) {
    const bookmark = bookmarks[i];

export default function candidates(q, { maxResults }) {
  let query = '';
  if (q) {
    query += `${q} ― `;
  }
  return Promise.resolve([{
    id:         `search-${q}`,
    label:      `${getMessage('search_placeholder', query)}`,
    type:       'search',
    args:       [q],
    faviconUrl: browser.extension.getURL('images/search.png'),
  }]).then(items => ({
    items: items.slice(0, maxResults),
    label: `${getMessage('search')} (:search or s)`,
  }));
}

showPage: function () {
    let dom;
    if (!TogglButton) {
      TogglButton = browser.extension.getBackgroundPage().TogglButton;
    }

    try {
      if (TogglButton.$user !== null) {
        if (!PopUp.editFormAdded) {
          dom = document.createElement('div');
          dom.innerHTML = TogglButton.getEditForm();
          PopUp.$editView.appendChild(dom.firstChild);
          PopUp.addEditEvents();
          PopUp.editFormAdded = true;
        }

        if (TogglButton.$curEntry === null) {
          if (TogglButton.$latestStoppedEntry) {
            localStorage.setItem(
              'latestStoppedEntry',

beforeAll(e) {
		if (this.disableAll) {
			return false;
		}
		//判断是否是HE自身
		if (this.excludeHe && e.url.indexOf(browser.extension.getURL('')) === 0) {
			return false;
		}
		return true;
	}

async function closeTabsExceptCurrent() {
  const otherTabs = await browser.tabs.query({'active': false, currentWindow: true})
  for(const tab of otherTabs) {
    await browser.tabs.remove(tab.id)
  }
  const popupWindow = await browser.extension.getViews({type: 'popup'})[0]
  popupWindow.close()
}

addIframeStyle = () => {
    const url = browser.extension.getURL('iframe.css');
    const link = document.createElement('link');

    link.type = 'text/css';
    link.rel = 'stylesheet';
    link.href = url;

    document.body.appendChild(link);
    return link;
  }

addIframeStyle = () => {
    const url = browser.extension.getURL('iframe.css')
    const link = document.createElement('link')

    link.type = 'text/css'
    link.rel = 'stylesheet'
    link.href = url

    document.body.appendChild(link)
    return link
  }

import browser from 'webextension-polyfill';
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { SortableContainer, SortableElement } from 'react-sortable-hoc';
import getMessage from '../utils/i18n';
import { defaultOrder } from '../reducers/options';

const dragIcon = browser.extension.getURL('images/drag.png');

const SortableItem = SortableElement(({ value }) => ((
  <li>
    <img alt="drag" src="{dragIcon}">
    {value}
  </li>
)));

const SortableList = SortableContainer(({ items }) =&gt; ((
  <ul>
    {items.map((value, index) =&gt; (
      
    ))}
  </ul>
)));

async function createPopup() {
  const popup = document.createElement('iframe');
  popup.src = browser.extension.getURL('popup/index.html');
  const { popupWidth } = await browser.storage.local.get('popupWidth');
  const w      = window.innerWidth - 100;
  const width  = Math.min(w, popupWidth || DEFAULT_POPUP_WIDTH);
  const height = window.innerHeight * 0.8;
  const left   = Math.round((window.innerWidth - width) * 0.5);
  const top    = Math.round((window.innerHeight - height) * 0.25);
  popup.id     = POPUP_FRAME_ID;
  popup.style.position        = 'fixed';
  popup.style.top             = `${top}px`;
  popup.style.left            = `${left}px`;
  popup.style.width           = `${width}px`;
  popup.style.height          = `${height}px`;
  popup.style.zIndex          = 10000000;
  popup.style.opacity         = `${POPUP_OPACITY}`;
  popup.style.boxShadow       = '0 0 1em';
  return popup;