量角器无法移动价格滑块答案

【问题标题】：Protractor not able to move price slider量角器无法移动价格滑块
【发布时间】：2021-01-07 06:07:23
【问题描述】：

我是量角器的新手，试图测试可以根据提供的价格范围对产品进行分类的价格滑块，我无法使用量角器拖动滑块（最小点）。如何移动滑块？

HTML

<span _ngcontent-serverapp-c119="" ngxsliderhandle="" class="ngx-slider-span ngx-slider-pointer ngx-slider-pointer-min" ng-reflect-ng-style="[object Object]" role="slider" tabindex="0" aria-orientation="" aria-label="" aria-labelledby="" aria-valuenow="10" aria-valuetext="10" aria-valuemin="10" aria-valuemax="100" style="opacity: 1; visibility: visible; left: 0px;"></span>

滑块图像

我试过了

    const priceTogggle = element(
        by.xpath(
            '//span[@class="ngx-slider-span ngx-slider-pointer ngx-slider-pointer-min"]'
        )
    );

browser.actions().dragAndDrop(priceTogggle,{x:100,y:0}).mouseUp().perform();  
and   
browser.actions().mouseMove(priceTogggle).mouseDown().mouseMove({x:100,y:0 }).mouseUp().perform()

【问题讨论】：

标签： javascript reactjs angular selenium protractor

【解决方案1】：

这是我用的

     /**
     * Drags first element to the second one. The destination can either be an elementFinder or an offset in pixels
     * @param    {ElementFinder}        $element
     * @param    {(ElementFinder|{x: number, y: number})}       $destination
     * @returns  {promise.Promise}
     */
    let dragAndDrop = ($element, $destination) => browser
            .actions()
            .mouseMove($element)
            .perform()
            .then(() =>
                browser
                    .actions()
                    .mouseDown($element)
                    .perform()
            )
            .then(() =>
                browser
                    .actions()
                    .mouseMove($destination)
                    .perform()
            )
            .then(() =>
                browser
                    .actions()
                    .mouseUp()
                    .perform()
            );

然后调用

await dragAndDrop($leftGrip, {x: 10, y: 0});

但x 可能需要为负数，具体取决于您要移动的方向

【讨论】：

我确信它对我有用。所以问题可能出在你的定位器上。也许你需要拖动另一个元素

【解决方案2】：

我不熟悉量角器。但是，如果您可以向我发送一个实现滑块的示例站点的链接，我可以尝试使用 selenium-webdriver java。

与此同时，您可以查看我对以下问题的回答中的代码，看看它是否对您有帮助。

Issue for Trip Advisor 5-star rating

【讨论】：