📌  相关文章
📜  如何使用量角器检查元素中是否存在文本?

📅  最后修改于: 2022-05-13 01:56:24.816000             🧑  作者: Mango

如何使用量角器检查元素中是否存在文本?

Protractor是为 AngularJS 应用程序开发的端到端测试框架,但是,它也适用于非 Angular JS 应用程序。它像真实用户一样对与之交互的应用程序运行测试,在真实浏览器中运行。在本文中,我们将使用Protractor来检查如何等待文本出现在元素中?

先决条件:Protractor的安装和设置

方法:我们将创建一个基本的测试程序,我们将在其中检查文本是否存在于元素中?所有Protractor测试都会有一个包含配置的文件,这将是启动测试的初始文件。

以下是上述方法的分步实施。

第 1 步:我们必须首先创建一个conf.js文件,其中包含要与Protractor一起使用的配置。

conf.js
exports.config = {
  
 // Define the capabilities to be passed
 // to the webdriver instance
 capabilities: {
   browserName: "chrome",
 },
  
 // Define the framework to be use
 framework: "jasmine",
   
 // Define the Spec patterns. This is relative
 // to the current working directory when
 // protractor is called
 specs: ["test.js"],
  
 SELENIUM_PROMISE_MANAGER: false,
  
 // Define the options to be used with Jasmine
 jasmineNodeOpts: {
  defaultTimeoutInterval: 30000,
 },
  
 // Define the baseUrl for the file
 baseUrl: "file://" + __dirname + "/",
  
 onPrepare: function () {
  browser.resetUrl = "file://";
 },
};


test.html



    
      fade-in effect on page load using JavaScript
    
    


  
  
    GFG   


test.js
describe('Protractor Demo App', function () {
  it('should have a title', async function () {
      
      var EC = protractor.ExpectedConditions;
  
      // Disable waiting for Angular render update
      browser.waitForAngularEnabled(false)
  
      // Get the HTML file that has to be tested
      browser.get('test.html');
  
      // Get the fade in element
      let fadeIn = element(by.id('fade-in'));
  
      // Waits for the element with id 'myInput' to contain the input 'foo'.
      browser.wait(EC.textToBePresentInElementValue(fadeIn, 'GFG'), 5000);
  
      expect(fadeIn.getText()).toEqual('GFG');
  });
});


第 2 步:我们将创建名为test.html的 HTML 文件,其中包含要测试的元素。

测试.html




    
      fade-in effect on page load using JavaScript
    
    


  
  
    GFG   

第 3 步:我们将创建test.js文件。在这个文件中,我们将访问上面的 HTML 文件,然后等待元素中包含特定的文本。 browser 是Protractor创建的全局变量,用于浏览器级别的命令,例如使用 browser.get() 方法进行导航。描述和它的语法来自 Jasmine 框架,其中 describe 是对您的测试的描述,同时它定义了测试的步骤。

测试.js

describe('Protractor Demo App', function () {
  it('should have a title', async function () {
      
      var EC = protractor.ExpectedConditions;
  
      // Disable waiting for Angular render update
      browser.waitForAngularEnabled(false)
  
      // Get the HTML file that has to be tested
      browser.get('test.html');
  
      // Get the fade in element
      let fadeIn = element(by.id('fade-in'));
  
      // Waits for the element with id 'myInput' to contain the input 'foo'.
      browser.wait(EC.textToBePresentInElementValue(fadeIn, 'GFG'), 5000);
  
      expect(fadeIn.getText()).toEqual('GFG');
  });
});

第 4 步:最后,我们将使用下面给出的命令运行配置文件。这将运行配置文件并运行测试,如下面的输出所示。

protractor conf.js

输出: