如何在protractor Node.js中获得一个元素的x和y坐标

如何在protractor Node.js中获得一个元素的x和y坐标

Protractor是一个端到端的测试框架,是为AngularJS和Angular应用程序开发的。它基本上是针对正在与之交互的应用程序运行测试,就像一个真实的用户一样,在一个真实的浏览器中运行。在下面的例子中,我们将获得一个元素的x和y坐标,并检查它是否符合预期。

步骤:

  • 我们将创建一个基本的测试程序,其中我们将检查一个元素的x和y坐标是否符合预期。
  • 所有的Protractor测试都有一个包含配置的文件,这个文件将是启动测试的初始文件。
  • 让我们创建这个文件,名称为conf.js。

例子。文件名:conf.js

exports.config = {
  
    // Capabilities values for
    // webdriver instance
    capabilities: {
        'browserName': 'chrome'
    },
  
    // Framework value
    framework: 'jasmine',
  
    // The Spec patterns are relative to the 
    // current working directory when
    // protractor is called.
    specs: ['test.js'],
  
    // Options which are passed to our
    // framework ie. Jasmine.
    jasmineNodeOpts: {
        defaultTimeoutInterval: 30000
    },
  
    // File URL
    baseUrl: 'file://' + __dirname + '/',
  
    onPrepare: function () {
        browser.resetUrl = 'file://';
    }
};

现在让我们创建一个名为test.html的HTML文件,其中将包含要测试的元素。

Filename: test.html

<!DOCTYPE html>
<html lang="en">
<body>
    <!-- The element to be tested -->
    <div id="foo" style="position: absolute;
        top:20px; left: 15px">
        Inner text
    </div>
</body>
</html>

现在让我们创建我们的测试文件test.js。在这个文件中,我们将访问一个HTML文件,然后获取x和y坐标,并检查它是否与HTML文件中的设置一致。浏览器是由Protractor创建的一个全局。

Jasmine框架提供了describe()函数和it()函数,其中describe是对你的测试的描述,而it是测试的步骤。

Filename: test.js

describe('Protractor Demo App', function () {
    it('should have a title', function () {
        // Disabling waiting for angular
        browser.waitForAngularEnabled(false)
  
        // Get our html file for testing
        browser.get('test.html');
  
        // Test if the element have required coordinates
        let foo = element(by.id('foo'));
        expect(foo.getLocation()).toEqual(
        jasmine.objectContaining({
            x: 15,
            y: 20
        }));
    });
});

使用以下命令运行conf.js文件。

protractor conf.js

输出:

如何在protractor Node.js中获得一个元素的x和y坐标?

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程