Question

我有一个 chrome 扩展，我在没有任何单元测试的情况下构建了它，但随着项目的发展，我觉得如果我对代码的某些部分进行更改，某些事情会中断。因此，在阅读了一些中等文章后，我决定使用 jasmine 对功能进行单元测试。我有一个名为 utils.ts 的文件，它具有 unwatchAssignment 函数。 utils.ts 从同一目录中名为 browser 的文件中导入模块 g 和变量 global.ts。现在我创建 utils.spec.ts 来测试函数 unwatchAssignment，如下所示：

import {unwatchAssignment} from "./utils";

    describe('utils', () => {
        let g;
    
        beforeAll(()=>{
            g = {
                rate:{
                    test:{}
                },
                tabsBeingWatched:{
                    "123":{
                        assignmentID:"test"
                    },
                    "456":{
                        assignmentID:"dent"
                    }
                },
                activeAssignment:null
            }
        })
        it('Should unwatch assignment',()=>{
            const assignmentId = "test";
            unwatchAssignment(assignmentId);
            expect(g.rate[assignmentId]).toBeFalsy();
        })
    })

我的 utils.ts 看起来像这样：

import { g, browser } from "./globals";


    export function unwatchAssignment(assId) {
      const assignmentWageRateInfo = g.rate[assId];
      if (assignmentWageRateInfo != null) {
        delete g.rate[assId];
        Object.keys(g.tabsBeingWatched).forEach((tabId) => {
          if (g.tabsBeingWatched[tabId].assignmentID == assId)
            delete tabsBeingWatched[tabId];
        });
        browser.storage.local.set({ rate: g.rate });
        if (
          g.activeAssignment != null &&
          g.activeAssignment.assignmentID == assId
        ) {
          g.activeAssignment = null;
        }
      }
    }

我的 globals.ts 看起来像这样：

export const browser = require("webextension-polyfill");
export class g {
  public static rate: any = {} ;
  public static tabsBeingWatched:any = {};
  public static activeAssignment:any;
}

当我使用 npm test 运行测试时出现错误：

Error: This script should only be loaded in a browser extension.
    at /home/myname/projects/browser-extension/node_modules/webextension-polyfill/dist/browser-polyfill.js:1164:11

发生此错误是因为我正在从终端运行 jasmine 测试，并且在扩展程序在浏览器上下文中运行时不存在全局变量 chrome。

我正在寻找以下问题的答案：

如何从 utils.ts 中的文件 utils.spec.ts 导入函数而不会出现上述错误？
我读过存根可以在我们测试其他东西时默默地让测试运行（在我的情况下，我的 it 当前正在测试 g.rate[assignmentId] 变量而不是 browser.storage 调用，所以我可以使用browser 模块作为存根。那么，如何在不更改 browser 的情况下为 utils.ts 模块创建存根？
在规范文件中创建变量 g 并使用它而不是从 globals.ts 文件导入是否正确。我读过嘲笑可以为我完成。通过在 describe 回调中创建变量并在 beforeAll 中对其进行初始化，我的模拟是否正确完成？

支持上述问题答案的任何示例都将非常有帮助。谢谢。

无法从需要 Web 浏览器的节点导入模块

0 个答案: