Cypress Stubbing 自定义类不起作用

Question

我正在尝试对类的返回方法进行存根，但是当我在控制台中打印返回值时，它们似乎没有被存根。我的测试课：

// MyCustomClass.ts
class MyCustomClass {
  // Define a static method
  public static myMethod(): string {
    return "MyCustomClass myMethod value";
  }

  // Define an instance method
  public anotherMethod(): string {
    return "MyCustomClass anotherMethod value";
  }
}

if (typeof window !== "undefined") {
  (window as any).MyCustomClass = MyCustomClass;
}

export default MyCustomClass;

globals.d.ts 包含：

export {}; // Make this a module
declare global {
  // Extend the Window interface in Cypress to include MyCustomClass
  interface Window {
    MyCustomClass: typeof MyCustomClass;
  }
}

测试文件：

import MyCustomClass from "ts/services/managers/MyCustomClass";
// Attach MyCustomClass to the window object
 let mainPage: MainPage;
describe("set work schedule", () => {
  beforeEach(() => {

    cy.window().then((win) => {
      win.MyCustomClass = MyCustomClass;
    }); 

    cy.window().should((win) => {
      console.log("on load");
      console.log(win.MyCustomClass);
      expect(win.MyCustomClass).to.exist; // passes
    });

    // Stub static and instance methods
    cy.window().then((win) => {
      cy.stub(win.MyCustomClass, "myMethod").returns("stubbed static value");
      cy.stub(win.MyCustomClass.prototype, "anotherMethod").returns("stubbed instance value");
    });

    // Verify the methods return the stubbed values
    cy.window().then((win) => {
      const staticResult = win.MyCustomClass.myMethod();
      expect(staticResult).to.equal("stubbed static value");

      const instance = new win.MyCustomClass();
      const instanceResult = instance.anotherMethod();
      expect(instanceResult).to.equal("stubbed instance value");
    });


console.log(MyCustomClass.myMethod()) // stubbed value

 mainPage = new MainPage();
 mainPage.open(); // -> calls console.log(MyCustomClass.myMethod()) and shows original value , not the stubbed
  });


      it("Test something", () => {
           console.log(MyCustomClass.myMethod()) // stubbed value
      });

1.在测试“测试某些内容”中，值被正确存根，但是在 mainPage.open() 中经过大量链式调用后，最终打印了 MyCustomClass.myMethod() ，但该值尚未存根，但它显示了原来的一个，这背后的原因是什么？ mainPage.open() 是否可能不知道存根？我可以访问在 mainPage().open() 中打印 MyCustomClass.myMethod() 的文件，并且我想让它使用存根值。

因此，TLDR beforeEach() 正确存根，调用 mainPage.open() 并打印 MyCustomClass.myMethod()，它显示原始值，在测试中我们打印 MyCustomClass.myMethod()，它是存根值

Answer 1

您错过了 MainPage 的代码，但我假设

open()

方法执行

cy.visit()

，这会更改从

cy.window()

返回的胜利，所以您存根太早了。

请参阅加载前的窗口显示如何使用

window:before:load

事件正确存根。

您也不需要对

win

进行嘈杂的分配，至少对于静态方法来说是这样。

主页

import MyCustomClass from './my-class'

class MainPage {
  public open(): void {
    cy.visit('https://example.com')
      .then(() => {
        // make sure you console.log after the window:before:load event
        // i.e after the stub is set up
        console.log('From MainPage (myMethod): ', MyCustomClass.myMethod())
      })
  }
}
export default MainPage;

测试

let mainPage: MainPage;
describe('stubs the static method', () => {

  beforeEach(() => {

    Cypress.on('window:before:load', () => {
      console.log('From "window:before:load" event')
      cy.stub(MyCustomClass, 'myMethod').returns('stubbed static value')
    })

    mainPage = new MainPage()
    mainPage.open() 
  })

  it('Test something', () => {
    console.log('From the test: ', MyCustomClass.myMethod()) 
    expect(MyCustomClass.myMethod()).to.eq('stubbed static value')
  })
})

柏树赛跑者

控制台