javascript - 使用 Electron/Webdriver 拖放

Question

我正在尝试为测试拖放功能的电子应用程序编写测试。我尝试了两种不同的方法。Webdriver 的原生 dragAndDrop 方法以及 performActions。然而，在这两种情况下，似乎什么都没有发生。如果我在使用应用程序时手动拖动它，该元素似乎不会移动，即使它可以正常工作。我目前正在使用：

“react-beautiful-dnd”：“^13.1.0”，“electron”：“^9.4.3”，“electron-chromedriver”：“^11.0.0”，“mocha”：“^8.2.1”， “反应”：“^16.4.0”，“selenium-webdriver”：“^4.0.0-beta.1”，“spectron”：“^11.0.0”，“spectron-keys”：“0.0.1” ,

这是我使用执行操作时测试的样子：

it('should display the correct string when the rows are dragged and dropped in a different order', async () => {
        const correctString = '"Field3": Value3^4 & "Field1": Value1^2 & "Field2": Value2^3'
        const target = await app.client.$('[id="search_input"]');
        const sourceElement = await app.client.$('[id="row_1"]');

        //function to get coordinates of the source element and the target.
        const getCoordsForElement = async (elementId) => {
            const rect = await app.client.getElementRect(elementId);
            const X = parseInt(rect.x + (rect.width / 2), 10);
            const Y = parseInt(rect.y + (rect.height / 2), 10);
            return [X, Y];
            };

        const [sourceX, sourceY] = await getCoordsForElement(sourceElement.elementId)
        const [targetX, targetY] = await getCoordsForElement(target.elementId)
        const [diffX, diffY] = [targetX - sourceX, targetY - sourceY]

        await app.client.performActions([{
            type: 'pointer',
            id: 'finger1',
            parameters: { pointerType: 'mouse' },
            actions: [
                { type: 'pointerMove', duration: 0, x:sourceX , y:sourceY },
                { type: 'pointerDown', button: 1 },
                { type: 'pause', duration: 500 },
                { type: 'pointerMove', duration: 1000, origin: "pointer", x: diffX, y: diffY },
                { type: 'pointerUp', button: 1 }
            ]
        }]);

        await app.client.pause(1000)
        const text = await searchInput.getValue()
        console.log("TEXT: ", text)
        assert.strictEqual(text, correctString, `Expected the correct string to be "${correctString}".  Instead it was "${text}".`)
    })

以下是我尝试使用 drapAndDrop 方法时的测试结果：

it('should display the correct string when the rows are dragged and dropped in a different order', async () => {
        const correctString = '"Field3": Value3^4 & "Field1": Value1^2 & "Field2": Value2^3'
        const target = await app.client.$('[id="search_input"]');
        const sourceElement= await app.client.$('[id="row_1"]');

        await sourceElement.dragAndDrop({x: -247, y: -210})

        await app.client.pause(1000)
        const text = await searchInput.getValue()
        console.log("TEXT: ", text)
        assert.strictEqual(text, correctString, `Expected the correct string to be "${correctString}".  Instead it was "${text}".`)
})

标签： javascriptreactjsseleniumselenium-webdriverelectron