检查 Button onClick 是否打开新选项卡的测试用例

Question

我是 UI 开发的新手，最近我开始使用 Typescript 在 React 中编写代码。我创建了一个按钮，单击该按钮后，它会打开一个菜单，其中包含一些可供选择的选项。如果我单击其中一个选项，将打开一个带有某个目标 URL 的新选项卡。我正在使用 window.open(target_URL, "_blank"); 来实现这一点。

现在我正在为我的代码编写测试用例，我想编写一个测试用例来检查如果我单击该选项，它会打开一个带有 target_URL 的新选项卡。

const myButton: HTMLElement = TestUtils.findRenderedDOMComponentWithClass(renderedComponent, "my-button") as HTMLElement;
    expect(myButton).to.not.be.undefined;

    // Click the Button and check number of options displayed
    TestUtils.Simulate.click(myButton);
    const menuItems: HTMLElement[] = TestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, "ms-ContextualMenu-item") as HTMLElement[];
    expect(menuItems).to.not.be.undefined;
    expect(menuItems.length).to.be.equal(4, "4 options dispalyed");

    const menuItem1: HTMLElement = TestUtils.findRenderedDOMComponentWithClass(renderedComponent, "menu-item-1") as HTMLElement;
    TestUtils.Simulate.click(menuItem1);

我已经编写了上面的代码，但我不确定如何完成此代码以检查在浏览器中打开新选项卡的情况。

Answer 1

window.open()方法将返回窗口对象，您可以检查该窗口：例如，尝试关闭窗口。
一般情况下，只能关闭自己创建的窗口，否则会出现错误。