diff --git a/packages/@textlint/compiler/package.json b/packages/@textlint/compiler/package.json
index 11e102d..f327138 100644
--- a/packages/@textlint/compiler/package.json
+++ b/packages/@textlint/compiler/package.json
@@ -52,6 +52,7 @@
   "dependencies": {
     "@textlint/config-loader": "^0.3.0",
     "@textlint/kernel": "^3.3.6",
+    "@textlint/types": "^1.4.5",
     "@textlint/runtime-helper": "^0.3.0",
     "meow": "^7.0.1",
     "rimraf": "^3.0.2",
diff --git a/packages/@textlint/compiler/src/CodeGenerator/API.ts b/packages/@textlint/compiler/src/CodeGenerator/API.ts
new file mode 100644
index 0000000..0702d63
--- /dev/null
+++ b/packages/@textlint/compiler/src/CodeGenerator/API.ts
@@ -0,0 +1,14 @@
+import type { TextlintFixResult, TextlintMessage, TextlintResult } from "@textlint/types";
+
+/**
+ * textlint Server API
+ */
+export type API = {
+    lint({ text, ext }: { text: string; ext: string }): TextlintResult[];
+    // fix all text with all rule
+    fixAll({ text, ext }: { text: string; ext: string }): TextlintFixResult;
+    // fix all with with a rule
+    fixRule({ text, ext, message }: { text: string; ext: string; message: TextlintMessage }): TextlintFixResult;
+    // fix the text
+    fixText({ text, ext, message }: { text: string; ext: string; message: TextlintMessage }): { output: string };
+};
diff --git a/packages/textchecker-element/public/index.ts b/packages/textchecker-element/public/index.ts
index 3967bec..f296a03 100644
--- a/packages/textchecker-element/public/index.ts
+++ b/packages/textchecker-element/public/index.ts
@@ -1,10 +1,11 @@
-import { attachToTextArea, AttachTextAreaParams } from "../src/index";
+import { attachToTextArea } from "../src/index";
 import type { TextlintFixResult, TextlintMessage, TextlintResult } from "@textlint/types";
 import type {
     TextlintWorkerCommandFix,
     TextlintWorkerCommandLint,
     TextlintWorkerCommandResponse
 } from "@textlint/compiler";
+import { LintEngineAPI } from "../src/attach-to-text-area";
 
 const statusElement = document.querySelector("#js-status");
 const updateStatus = (status: string) => {
@@ -42,7 +43,7 @@ const waiterForInit = (worker: Worker) => {
 const workerStatus = waiterForInit(worker);
 
 const createTextlint = ({ ext }: { ext: string }) => {
-    const lintText: AttachTextAreaParams["lintText"] = async ({ text }: { text: string }): Promise<TextlintResult> => {
+    const lintText: LintEngineAPI["lintText"] = async ({ text }: { text: string }): Promise<TextlintResult[]> => {
         updateStatus("linting...");
         return new Promise((resolve, _reject) => {
             worker.addEventListener(
@@ -50,7 +51,7 @@ const createTextlint = ({ ext }: { ext: string }) => {
                 function (event) {
                     const data: TextlintWorkerCommandResponse = event.data;
                     if (data.command === "lint:result") {
-                        resolve(data.result);
+                        resolve([data.result]);
                     }
                     updateStatus("linted");
                 },
@@ -65,12 +66,12 @@ const createTextlint = ({ ext }: { ext: string }) => {
             } as TextlintWorkerCommandLint);
         });
     };
-    const fixText: AttachTextAreaParams["fixText"] = async ({
+    const fixText = async ({
         text,
         message
     }: {
         text: string;
-        message: TextlintMessage;
+        message?: TextlintMessage;
     }): Promise<TextlintFixResult> => {
         updateStatus("fixing...");
         return new Promise((resolve, _reject) => {
@@ -90,7 +91,7 @@ const createTextlint = ({ ext }: { ext: string }) => {
             return worker.postMessage({
                 command: "fix",
                 text,
-                ruleId: message.ruleId,
+                ruleId: message?.ruleId,
                 ext: ext
             } as TextlintWorkerCommandFix);
         });
@@ -106,6 +107,24 @@ const createTextlint = ({ ext }: { ext: string }) => {
     const targetElement = document.querySelectorAll("textarea");
     const textlint = createTextlint({ ext: ".md" });
     await workerStatus.ready();
+    const lintEngine: LintEngineAPI = {
+        lintText: textlint.lintText,
+        fixText: async ({ text, message }): Promise<{ output: string }> => {
+            if (!message.fix || !message.fix.range) {
+                return { output: text };
+            }
+            // replace fix.range[0, 1] with fix.text
+            return {
+                output: text.slice(0, message.fix.range[0]) + message.fix.text + text.slice(message.fix.range[1])
+            };
+        },
+        fixAll({ text }: { text: string }): Promise<TextlintFixResult> {
+            return textlint.fixText({ text });
+        },
+        fixRule({ text, message }: { text: string; message: TextlintMessage }): Promise<TextlintFixResult> {
+            return textlint.fixText({ text, message });
+        }
+    };
     targetElement.forEach((element) => {
         if (text) {
             element.value = text;
@@ -113,8 +132,7 @@ const createTextlint = ({ ext }: { ext: string }) => {
         attachToTextArea({
             textAreaElement: element,
             lintingDebounceMs: 200,
-            lintText: textlint.lintText,
-            fixText: textlint.fixText
+            lintEngine
         });
     });
 })();
diff --git a/packages/textchecker-element/src/attach-to-text-area.ts b/packages/textchecker-element/src/attach-to-text-area.ts
index 9b053c4..f48819b 100644
--- a/packages/textchecker-element/src/attach-to-text-area.ts
+++ b/packages/textchecker-element/src/attach-to-text-area.ts
@@ -18,6 +18,19 @@ const createCompositionHandler = () => {
     };
 };
 
+/**
+ * Lint Server API
+ */
+export type LintEngineAPI = {
+    lintText({ text }: { text: string }): Promise<TextlintResult[]>;
+    // fix all text with all rule
+    fixAll({ text }: { text: string }): Promise<TextlintFixResult>;
+    // fix all with with a rule
+    fixRule({ text, message }: { text: string; message: TextlintMessage }): Promise<TextlintFixResult>;
+    // fix the text
+    fixText({ text, message }: { text: string; message: TextlintMessage }): Promise<{ output: string }>;
+};
+
 export type AttachTextAreaParams = {
     /**
      * target textarea element
@@ -28,15 +41,14 @@ export type AttachTextAreaParams = {
      * default: 200ms
      */
     lintingDebounceMs: number;
-    // process
-    lintText: ({ text }: { text: string }) => Promise<TextlintResult>;
-    fixText: ({ text, message }: { text: string; message: TextlintMessage }) => Promise<TextlintFixResult>;
+    // user should implement LintEngineAPI and pass it
+    lintEngine: LintEngineAPI;
 };
 
 /**
  * Attach text-checker component to `<textarea>` element
  */
-export const attachToTextArea = ({ textAreaElement, lintingDebounceMs, lintText, fixText }: AttachTextAreaParams) => {
+export const attachToTextArea = ({ textAreaElement, lintingDebounceMs, lintEngine }: AttachTextAreaParams) => {
     const textChecker = new TextCheckerElement({
         targetElement: textAreaElement,
         hoverPadding: 10
@@ -52,58 +64,77 @@ export const attachToTextArea = ({ textAreaElement, lintingDebounceMs, lintText,
             return;
         }
         const text = textAreaElement.value;
-        const result = await lintText({
+        const results = await lintEngine.lintText({
             text
         });
-        const annotations = result.messages.map((message) => {
-            const card: TextCheckerCard = {
-                id: message.ruleId + "::" + message.index,
-                message: message.message,
-                fixable: Boolean(message.fix)
-            };
-            return {
-                start: message.index,
-                end: message.index + 1,
-                onMouseEnter: ({ rectItem }: { rectItem: TextCheckerElementRectItem }) => {
-                    textCheckerPopup.updateCard({
-                        card: card,
-                        rect: {
-                            top:
-                                rectItem.boxBorderWidth +
-                                rectItem.boxMarginTop +
-                                rectItem.boxPaddingTop +
-                                rectItem.boxAbsoluteY +
-                                rectItem.top +
-                                rectItem.height,
-                            left: rectItem.boxAbsoluteX + rectItem.left,
-                            width: rectItem.width
-                        },
-                        handlers: {
-                            async onFixIt() {
-                                const currentText = text;
-                                const fixResult = await fixText({
-                                    text,
-                                    message
-                                });
-                                if (currentText === text && currentText !== fixResult.output) {
-                                    textAreaElement.value = fixResult.output;
-                                    await update();
-                                    textCheckerPopup.dismissCard(card);
-                                }
-                            },
-                            onIgnore() {
-                                console.log("onIgnore");
+        const updateText = async (newText: string, card: TextCheckerCard) => {
+            const currentText = textAreaElement.value;
+            if (currentText === text && currentText !== newText) {
+                textAreaElement.value = newText;
+                await update();
+                textCheckerPopup.dismissCard(card);
+            }
+        };
+        const annotations = results.flatMap((result) => {
+            return result.messages.map((message) => {
+                const card: TextCheckerCard = {
+                    id: message.ruleId + "::" + message.index,
+                    message: message.message,
+                    messageRuleId: message.ruleId,
+                    fixable: Boolean(message.fix)
+                };
+                return {
+                    start: message.index,
+                    end: message.index + 1,
+                    onMouseEnter: ({ rectItem }: { rectItem: TextCheckerElementRectItem }) => {
+                        textCheckerPopup.updateCard({
+                            card: card,
+                            rect: {
+                                top:
+                                    rectItem.boxBorderWidth +
+                                    rectItem.boxMarginTop +
+                                    rectItem.boxPaddingTop +
+                                    rectItem.boxAbsoluteY +
+                                    rectItem.top +
+                                    rectItem.height,
+                                left: rectItem.boxAbsoluteX + rectItem.left,
+                                width: rectItem.width
                             },
-                            onSeeDocument() {
-                                console.log("onSeeDocument");
+                            handlers: {
+                                async onFixText() {
+                                    const fixResults = await lintEngine.fixText({
+                                        text,
+                                        message
+                                    });
+                                    await updateText(fixResults.output, card);
+                                },
+                                async onFixAll() {
+                                    const fixResults = await lintEngine.fixAll({
+                                        text
+                                    });
+                                    await updateText(fixResults.output, card);
+                                },
+                                async onFixRule() {
+                                    const fixResults = await lintEngine.fixRule({
+                                        text,
+                                        message
+                                    });
+                                    await updateText(fixResults.output, card);
+                                },
+                                onIgnore() {
+                                    console.log("onIgnore");
+                                },
+                                onSeeDocument() {
+                                    console.log("onSeeDocument");
+                                }
                             }
-                        }
-                    });
-                },
-                onMouseLeave() {
-                    textCheckerPopup.dismissCard(card);
-                }
-            };
+                        });
+                    },
+                    onMouseLeave() {
+                        textCheckerPopup.dismissCard(card);
+                    }
+                };
+            });
         });
         textChecker.updateAnnotations(annotations);
     }, lintingDebounceMs);
diff --git a/packages/textchecker-element/src/text-checker-popup-element.ts b/packages/textchecker-element/src/text-checker-popup-element.ts
index b5bbbc3..3cb5908 100644
--- a/packages/textchecker-element/src/text-checker-popup-element.ts
+++ b/packages/textchecker-element/src/text-checker-popup-element.ts
@@ -7,6 +7,7 @@ export type TextCheckerPopupElementAttributes = {
 export type TextCheckerCard = {
     id: string;
     message: string;
+    messageRuleId: string;
     fixable: boolean;
 };
 export type TextCheckerCardRect = {
@@ -17,7 +18,9 @@ export type TextCheckerCardRect = {
 };
 
 export type TextCheerHandlers = {
-    onFixIt?: () => void;
+    onFixText?: () => void;
+    onFixAll?: () => void;
+    onFixRule?: () => void;
     onIgnore?: () => void;
     onSeeDocument?: () => void;
 };
@@ -169,7 +172,7 @@ export class TextCheckerPopupElement extends HTMLElement {
                 ? {
                       message: firstLine,
                       label: "Fix it!",
-                      onClick: state.handlers?.onFixIt,
+                      onClick: state.handlers?.onFixText,
                       icon: html`<svg
                           class="popup-listItem--icon"
                           width="24"
@@ -186,6 +189,46 @@ export class TextCheckerPopupElement extends HTMLElement {
                 : {
                       message: state.card.message
                   },
+            ...(state.card.fixable
+                ? [
+                      {
+                          label: `Fix this rule: ${state.card.messageRuleId} problems`,
+                          onClick: state.handlers?.onFixRule,
+                          icon: html`<svg
+                              class="popup-listItem--icon"
+                              width="24"
+                              height="24"
+                              viewBox="0 0 24 24"
+                              fill="none"
+                              xmlns="http://www.w3.org/2000/svg"
+                          >
+                              <path
+                                  d="M7.5 5.6L5 7L6.4 4.5L5 2L7.5 3.4L10 2L8.6 4.5L10 7L7.5 5.6ZM19.5 15.4L22 14L20.6 16.5L22 19L19.5 17.6L17 19L18.4 16.5L17 14L19.5 15.4ZM22 2L20.6 4.5L22 7L19.5 5.6L17 7L18.4 4.5L17 2L19.5 3.4L22 2ZM13.34 12.78L15.78 10.34L13.66 8.22L11.22 10.66L13.34 12.78ZM14.37 7.29L16.71 9.63C17.1 10 17.1 10.65 16.71 11.04L5.04 22.71C4.65 23.1 4 23.1 3.63 22.71L1.29 20.37C0.899998 20 0.899998 19.35 1.29 18.96L12.96 7.29C13.35 6.9 14 6.9 14.37 7.29Z"
+                              />
+                          </svg>`
+                      }
+                  ]
+                : []),
+            ...(state.card.fixable
+                ? [
+                      {
+                          label: `Fix all problems`,
+                          onClick: state.handlers?.onFixAll,
+                          icon: html`<svg
+                              class="popup-listItem--icon"
+                              width="24"
+                              height="24"
+                              viewBox="0 0 24 24"
+                              fill="none"
+                              xmlns="http://www.w3.org/2000/svg"
+                          >
+                              <path
+                                  d="M7.5 5.6L5 7L6.4 4.5L5 2L7.5 3.4L10 2L8.6 4.5L10 7L7.5 5.6ZM19.5 15.4L22 14L20.6 16.5L22 19L19.5 17.6L17 19L18.4 16.5L17 14L19.5 15.4ZM22 2L20.6 4.5L22 7L19.5 5.6L17 7L18.4 4.5L17 2L19.5 3.4L22 2ZM13.34 12.78L15.78 10.34L13.66 8.22L11.22 10.66L13.34 12.78ZM14.37 7.29L16.71 9.63C17.1 10 17.1 10.65 16.71 11.04L5.04 22.71C4.65 23.1 4 23.1 3.63 22.71L1.29 20.37C0.899998 20 0.899998 19.35 1.29 18.96L12.96 7.29C13.35 6.9 14 6.9 14.37 7.29Z"
+                              />
+                          </svg>`
+                      }
+                  ]
+                : []),
             {
                 label: "Ignore",
                 onClick: state.handlers?.onIgnore,
diff --git a/packages/webextension/app/manifest.json b/packages/webextension/app/manifest.json
index ebb28da..7e25129 100644
--- a/packages/webextension/app/manifest.json
+++ b/packages/webextension/app/manifest.json
@@ -32,6 +32,8 @@
     "activeTab",
     "contextMenus",
     "downloads",
+    "webRequest",
+    "webRequestBlocking",
     "tabs",
     "<all_urls>"
   ]
diff --git a/packages/webextension/app/pages/install-dialog.html b/packages/webextension/app/pages/install-dialog.html
new file mode 100644
index 0000000..50f7b06
--- /dev/null
+++ b/packages/webextension/app/pages/install-dialog.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Install Dialog</title>
+</head>
+<body>
+<h1>Install Page</h1>
+<div>
+    <button id="js-install-button">Install</button>
+</div>
+<script src="../scripts/install-dialog.js"></script>
+</body>
+</html>
diff --git a/packages/webextension/app/scripts/background.ts b/packages/webextension/app/scripts/background.ts
index 0111f67..45489b9 100644
--- a/packages/webextension/app/scripts/background.ts
+++ b/packages/webextension/app/scripts/background.ts
@@ -1,7 +1,8 @@
 import { browser } from "webextension-polyfill-ts";
 import { createBackgroundEndpoint, isMessagePort } from "comlink-extension";
 import * as Comlink from "comlink";
-import { createTextlintPage } from "./background/textlint";
+import { createTextlintWorker } from "./background/textlint";
+import { openDatabase } from "./background/openDatabase";
 
 browser.runtime.onInstalled.addListener((details) => {
     console.log("previousVersion", details.previousVersion);
@@ -11,17 +12,88 @@ browser.tabs.onUpdated.addListener(async (tabId) => {
     browser.pageAction.show(tabId);
 });
 
-const textlint = createTextlintPage();
-// receive
-const backgroundExposedObject = {
-    lintText: textlint.lintText,
-    fixText: textlint.fixText
+const gContentTypeRe = (() => {
+    const userScriptTypes = [
+        "text/plain",
+        "application/ecmascript",
+        "application/javascript",
+        "application/x-javascript",
+        "text/ecmascript",
+        "text/javascript"
+    ];
+    return new RegExp(`^(${userScriptTypes.join("|")})\\b`);
+})();
+
+function responseHasUserScriptType(responseHeaders: any) {
+    for (let header of responseHeaders) {
+        let headerName = header.name.toLowerCase();
+        if ("content-type" === headerName && gContentTypeRe.test(header.value)) {
+            return true;
+        }
+    }
+    return false;
+}
+
+async function openInstallDialog(url: string) {
+    const installUrl = browser.runtime.getURL("/pages/install-dialog.html") + "?script=" + encodeURIComponent(url);
+    const options = {
+        height: 640,
+        type: "popup",
+        url: installUrl,
+        width: 480
+    } as const;
+    const window = await browser.windows.create(options);
+    console.log("window", window);
+}
+
+browser.webRequest.onHeadersReceived.addListener(
+    (details) => {
+        console.log("details", details);
+        if (details.method != "GET") return {};
+        if (!responseHasUserScriptType(details.responseHeaders)) return {};
+
+        openInstallDialog(details.url);
+        // https://stackoverflow.com/a/18684302
+        return { redirectUrl: "javascript:" };
+    },
+    { urls: ["*://*/*/textlint.js"], types: ["main_frame"] },
+    ["blocking", "responseHeaders"]
+);
+type ThenArg<T> = T extends PromiseLike<infer U> ? U : T;
+
+type DataBase = ReturnType<typeof openDatabase>;
+export type backgroundExposedObject = {
+    lintText: ReturnType<typeof createTextlintWorker>["lintText"];
+    fixText: ReturnType<typeof createTextlintWorker>["fixText"];
+    addScript: ThenArg<DataBase>["addScript"];
 };
-export type backgroundExposedObject = typeof backgroundExposedObject;
 browser.runtime.onConnect.addListener(async (port) => {
     if (isMessagePort(port)) {
         return;
     }
-    await textlint.ready();
+    const db = await openDatabase();
+    const originUrl = port.sender?.url;
+    const scripts = originUrl ? await db.findScriptsWithPatten(originUrl) : [];
+    const workers = scripts.map((script) => {
+        const blob = new Blob([script.code], { type: "application/javascript" });
+        return createTextlintWorker(URL.createObjectURL(blob));
+    });
+    // TODO multiple worker?
+    const lintText:ReturnType<typeof createTextlintWorker>["lintText"] = ()
+    const backgroundExposedObject: backgroundExposedObject = {
+        lintText: textlint.lintText,
+        fixText: textlint.fixText,
+        addScript: (script) => {
+            return db.addScript(script);
+        }
+    };
+    port.onDisconnect.addListener(() => {
+        console.log("dispose worker");
+        workers.forEach((worker) => {
+            worker.dispose();
+        });
+    });
+    console.log(port.sender);
+    await Promise.all(workers.map((worker) => worker.ready()));
     Comlink.expose(backgroundExposedObject, createBackgroundEndpoint(port));
 });
diff --git a/packages/webextension/app/scripts/background/openDatabase.ts b/packages/webextension/app/scripts/background/openDatabase.ts
new file mode 100644
index 0000000..b3ba3c4
--- /dev/null
+++ b/packages/webextension/app/scripts/background/openDatabase.ts
@@ -0,0 +1,39 @@
+import { openDB, DBSchema, StoreValue } from "idb";
+import minimatch from "minimatch";
+
+interface TextlintJsDB extends DBSchema {
+    scripts: {
+        value: {
+            name: string;
+            code: string;
+            pattern: string;
+        };
+        key: string;
+        indexes: { "by-name": string };
+    };
+}
+
+export async function openDatabase() {
+    const db = await openDB<TextlintJsDB>("textlintjs-db", 1, {
+        upgrade(db) {
+            const productStore = db.createObjectStore("scripts", {
+                keyPath: "name"
+            });
+            productStore.createIndex("by-name", "name", { unique: true });
+        }
+    });
+    return {
+        async addScript(script: StoreValue<TextlintJsDB, "scripts">) {
+            console.log("script", script);
+            return db.add("scripts", script);
+        },
+        async findScriptsWithPatten(url: string) {
+            const scripts = await db.getAll("scripts");
+            return scripts.filter((script) => {
+                const minimatch1 = minimatch(url, script.pattern);
+                console.log(minimatch1, url, script.pattern);
+                return minimatch1;
+            });
+        }
+    };
+}
diff --git a/packages/webextension/app/scripts/background/textlint.ts b/packages/webextension/app/scripts/background/textlint.ts
index a43d72b..f73b552 100644
--- a/packages/webextension/app/scripts/background/textlint.ts
+++ b/packages/webextension/app/scripts/background/textlint.ts
@@ -46,7 +46,7 @@ const createWorkerRef = (worker: Worker) => {
         }
     };
 };
-export const createTextlintPage = (defaultWorkerUrl: string | URL = "download/textlint.js") => {
+export const createTextlintWorker = (defaultWorkerUrl: string | URL = "download/textlint.js") => {
     const defaultWorker = new Worker(defaultWorkerUrl);
     const workerRef = createWorkerRef(defaultWorker);
     const lintText = async ({ text, ext }: { text: string; ext: string }): Promise<TextlintResult> => {
@@ -106,6 +106,9 @@ export const createTextlintPage = (defaultWorkerUrl: string | URL = "download/te
         ready() {
             return workerRef.ready();
         },
+        dispose() {
+            return workerRef.current.terminate();
+        },
         updateWorker(workerUrl: string | URL) {
             workerRef.updateWorker(new Worker(workerUrl));
         }
diff --git a/packages/webextension/app/scripts/install-dialog.ts b/packages/webextension/app/scripts/install-dialog.ts
new file mode 100644
index 0000000..d1f3ff4
--- /dev/null
+++ b/packages/webextension/app/scripts/install-dialog.ts
@@ -0,0 +1,25 @@
+import { createEndpoint } from "comlink-extension";
+import * as Comlink from "comlink";
+import type { backgroundExposedObject } from "./background";
+import { browser } from "webextension-polyfill-ts";
+
+const port = Comlink.wrap<backgroundExposedObject>(createEndpoint(browser.runtime.connect()));
+
+async function installHandler() {
+    const url = new URL(location.href);
+    const script = url.searchParams.get("script");
+    if (!script) {
+        throw new Error(`?script is not found: ${location.href}`);
+    }
+    const scriptURL = decodeURIComponent(script);
+    const content = await fetch(scriptURL).then((res) => res.text());
+    console.log(content);
+    // Save to DB
+    await port.addScript({
+        name: "default",
+        code: content,
+        pattern: "**/*"
+    });
+}
+
+document.querySelector("#js-install-button")?.addEventListener("click", installHandler);
diff --git a/packages/webextension/package.json b/packages/webextension/package.json
index 3c62855..ca3eda4 100644
--- a/packages/webextension/package.json
+++ b/packages/webextension/package.json
@@ -8,20 +8,22 @@
     "build": "webextension-toolbox build"
   },
   "devDependencies": {
-
     "copy-webpack-plugin": "^6.0.3",
     "ts-loader": "^8.0.1",
     "webextension-toolbox": "^3.0.0",
     "webpack": "^4.44.0",
-    "webpack-watched-glob-entries-plugin": "^2.1.6"
+    "webpack-watched-glob-entries-plugin": "^2.1.6",
+    "@types/minimatch": "^3.0.3"
   },
   "dependencies": {
     "@textlint/types": "^1.4.5",
+    "minimatch": "^3.0.4",
     "@webcomponents/custom-elements": "^1.4.2",
+    "comlink": "^4.3.0",
+    "comlink-extension": "^1.0.8",
     "enable-webcomponents-in-content-scripts": "^1.0.7",
+    "idb": "^5.0.4",
     "textchecker-element": "^0.3.0",
-    "webextension-polyfill-ts": "^0.19.0",
-    "comlink": "^4.3.0",
-    "comlink-extension": "^1.0.8"
+    "webextension-polyfill-ts": "^0.19.0"
   }
 }
diff --git a/yarn.lock b/yarn.lock
index 2cc3840..9c44e4a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5850,6 +5850,11 @@ icss-replace-symbols@1.1.0, icss-replace-symbols@^1.1.0:
   resolved "https://registry.yarnpkg.com/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz#06ea6f83679a7749e386cfe1fe812ae5db223ded"
   integrity sha1-Bupvg2ead0njhs/h/oEq5dsiPe0=
 
+idb@^5.0.4:
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/idb/-/idb-5.0.4.tgz#9b6d42d5eff3c7f063b6f4d3e7c7e9aaeae2fd7a"
+  integrity sha512-g+CRa0NLB5R+VTd8UQK/J8eEPlZk82iwekJQOYA0bFJsc7TGDKyBywNmLBUdHPUyyazV1wN8DdHhSKzEX9Z9kQ==
+
 ieee754@^1.1.4:
   version "1.1.13"
   resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.1.13.tgz#ec168558e95aa181fd87d37f55c32bbcb6708b84"