首页 > 解决方案 > 如何使用量角器打印元素列表以进行控制台

问题描述

我是 Stack Overflow 的新手。在我的应用程序中,我必须创建一个组并通过在列表中搜索组来验证该组是否已创建。如果该组在列表中,我必须打开该组的聊天框。所有这些场景都应该使用量角器自动化。我是量角器的新手,所以请您提供一个解释和答案

  1. 尝试遍历组名以检查是否已创建。
  2. 尝试在控制台中简单地打印组名,但仍然不成功。

尝试在量角器中打印组文本:

this.getElements = function(){
  element.all(by.css('some text')).getText().then(function(text){
      console.log(text);
  });
};

HTML 片段:

<ul class="list-unstyled users-list components">
      <!----><q4s-spinner _nghost-c4=""><div _ngcontent-c4="" class="spinner" hidden=""></div>
</q4s-spinner>
      <!----><div class="user-profile-container">
        <!---->
        <!----><div class="row each-user">
          <div class="user-profile-picture">
            <!---->
            <!----><div>
              <!----><img class="img-fluid user-picture" src="http://13.126.104.174/static/6286/BMP.jpeg">
              <!---->
              
            </div>

            <!---->
          </div>
          <div class="user-profile-details">
            <div class="row">
              <p class="group-name-text">myGrpW</p>
              <!----><span>
                <!---->
              </span>
            </div>
            <!----><p class="group-details-text"></p>
            <!---->
            <p class="group-members-text">2 Members</p>
            <!----><span>
              <!----><p class="admin-text"> Admin </p>
              <!---->
            </span>
          </div>


          <!----><div class="more-action-image-position">
            <div>
              <img class="img-fluid more-icon" placement="left" src="assets/images/more-icon.svg">
              <!---->
            </div>
          </div>

          <!---->
        </div>
      </div><div class="user-profile-container">
        <!---->
        <!----><div class="row each-user">
          <div class="user-profile-picture">
            <!---->
            <!----><div>
              <!----><img class="img-fluid user-picture" src="http://13.126.104.174/static/6286/BMP.jpeg">
              <!---->
              
            </div>

            <!---->
          </div>
          <div class="user-profile-details">
            <div class="row">
              <p class="group-name-text">newWWW</p>
              <!----><span>
                <!---->
              </span>
            </div>
            <!----><p class="group-details-text"></p>
            <!---->
            <p class="group-members-text">3 Members</p>
            <!----><span>
              <!----><p class="admin-text"> Admin </p>
              <!---->
            </span>
          </div>


          <!----><div class="more-action-image-position">
            <div>
              <img class="img-fluid more-icon" placement="left" src="assets/images/more-icon.svg">
              <!---->
            </div>
          </div>

          <!---->
        </div>
      </div><div class="user-profile-container">
        <!---->
        <!----><div class="row each-user">
          <div class="user-profile-picture">
            <!---->
            <!----><div>
              <!----><img class="img-fluid user-picture" src="http://13.126.104.174/static/6286/BMP.jpeg">
              <!---->
              
            </div>

            <!---->
          </div>
          <div class="user-profile-details">
            <div class="row">
              <p class="group-name-text">AutoWa</p>
              <!----><span>
                <!---->
              </span>
            </div>
            <!----><p class="group-details-text"></p>
            <!---->
            <p class="group-members-text">3 Members</p>
            <!----><span>
              <!----><p class="admin-text"> Admin </p>
              <!---->
            </span>
          </div>


          <!----><div class="more-action-image-position">
            <div>
              <img class="img-fluid more-icon" placement="left" src="assets/images/more-icon.svg">
              <!---->
            </div>
          </div>

          <!---->
        </div>
      </div><div class="user-profile-container">
        <!---->
        <!----><div class="row each-user">
          <div class="user-profile-picture">
            <!---->
            <!----><div>
              <!----><img class="img-fluid user-picture" src="http://13.126.104.174/static/6286/BMP.jpeg">
              <!---->
              
            </div>

            <!---->
          </div>

标签: jasmineprotractor

解决方案


如果您尝试检查元素中的文本,则需要使用 and expect

expect(element.all(by.css('some-text').getText()).toContain('expected text');

您还需要确保使用正确的CSS 选择器。要从示例 html 中获取组名,您可以使用p.group-name-text. 整个期望看起来像:

expect(element.all(by.css('p.group-name-text').getText().toContain('MyGrpW');

如果您只是尝试将文本打印到控制台,您的代码将如下所示

element.all(by.css('p.group-name-text').getText()).then(function(text){
  console.log(text);
});

推荐阅读