如何使用TestCafe访问应用程序操作？

Question

我试图寻找答案，但找不到。 我想在testcafe中开始测试之前编写一个函数来删除以前使用过的测试组织。

如果通过UI进行操作，这是一个非常耗时的操作。 所以我想知道是否可以使用app动作并编写一个函数来删除我的测试数据？

我的想法是执行下面的步骤：1。找到我要删除的所有测试组织2.遍历每一个，调用ShowDeleteOrgModal（）方法，然后调用DeleteOrganisation（）方法。

我看到其他测试工具使用window（）提供对应用程序操作的访问。 有什么办法可以在testCafe中实现它吗？

按钮选择器如下所示。

<button class="button_class" onclick="OurApplicationName.ShowDeleteOrgModal('organisation_id');
return false;">Delete Organisation</button>

我们用这种方式在柏树中实现了类似的想法：

CleanUpOrgs() {
         cy.window().then((win) => {
         let numberOfOrgs = win.window.$('tr:contains(' + Cypress.env('testOrgName') + ')').length;
            while (numberOfOrgs > 0) {
                cy.get('table').contains('tr', Cypress.env('testOrgName')).then(elem => {
                    let orgId = elem[0].id.replace('OurApplicationName_', '');
                    cy.window().then((win) => {
                        win.window.OurApplicationName.ShowDeleteOrgModal(orgId);
                        win.window.OurApplicationName.DeleteOrganisation();
                        cy.wait(2000);
                    });
                });
                numberOfOrgs--;
            }
        });
    },

如何使用TestCafe访问窗口？

Answer 1

尝试使用ClientFunction 。 例如，您可以使用以下代码打开模态：

import { ClientFunction } from 'testcafe';

const showDeleteOrgModal = ClientFunction(organizationId => {
    OurApplicationName.ShowDeleteOrgModal(organizationId);
});

fixture`My fixture`
    .page`http://www.example.com/`;

test('My Test', async t => {
    await showDeleteOrgModal('organisation_id');
});

您也可以通过这种方式在客户端运行异步代码 。

---

更新我无法为您提供无法访问测试页面的精确测试。 但我已经创建了一个示例，该测试的外观如何

import { ClientFunction, Selector, t } from 'testcafe';
import { testOrgName } from './config';

fixture`fixture`
    .page`http://url`;

const trElSelector = Selector('table').find('tr').withText(testOrgName);

const cleanUpOrg = ClientFunction(() => {
    const trElement = trElSelector();
    const orgId     = trElement.id.replace('OurApplicationName_', '');

    window.OurApplicationName.ShowDeleteOrgModal(orgId);
    window.OurApplicationName.DeleteOrganisation();
}, { dependencies: { trElSelector } });

async function cleanUpAllOrgs () {
    const numberOfOrgs = await Selector('tr').withText(testOrgName).length;

    for (let i = numberOfOrgs; i > 0; i--) {
        await cleanUpOrg();
        await t.wait(200);
    }
}

test('test', async t => {
    await cleanUpAllOrgs();
});

我使用ClientFunctions ， Selectors和testOrgName变量的配置文件（您可以在FAQ中了解有关使用配置和环境变量的更多信息）。