Question

我正在使用Protractor和Jasmine来测试我的应用程序。我必须验证应用程序抛出的消息是否正确。消息框仅可见10秒。我尝试使用ID，但它没有用。错误消息：＆＃34;找不到使用定位符的元素：By（css selector，* [id =＆＃34; Message1＆＃34;]）＆＃34; 下面是元素的HTML：

   <div class="alert alert-warning alert-dismissible ng-scope" role="alert" ng-if="message.error" id="Message">
<strong id="Message1" class="ng-binding">Please Enter Valid License Key</strong>

上面的元素位于模态对话框中。模态对话的完整HTML如下所述：

     <div class="modal-content" uib-modal-transclude="">
    <div class="modal-header ng-scope">
        <h4 class="modal-title ng-binding" id="modal-title">Register New License Key</h4>
    </div>
    <div class="modal-body ng-scope" id="modal-body">
        <form name="RegisterNewLicenseKeyForm" ng-submit="Register(objDs)" novalidate="" class="ng-pristine ng-invalid ng-invalid-required">
            <div class="form-group">
                <label for="LicenseKey" class="ng-binding">License Key</label>
                <textarea class="form-control ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required" rows="3" id="LicenseKey" name="LICENSE_KEY" ng-model="objDs.LICENSE_KEY" placeholder="License Key" ng-required="true" my-maxlength="500" tab-index="" ng-trim="false" required="required" style=""></textarea>
            </div>
            <!-- ngIf: !RegisterNewLicenseKeyForm.$valid --><div ng-if="!RegisterNewLicenseKeyForm.$valid" class="ng-scope">
                <form-response-message><!-- ngIf: message.error --><div class="alert alert-warning alert-dismissible ng-scope" role="alert" ng-if="message.error" id="Message">
    <strong id="Message1" class="ng-binding">Please Enter Valid License Key</strong>
</div><!-- end ngIf: message.error -->
</form-response-message>
            </div><!-- end ngIf: !RegisterNewLicenseKeyForm.$valid -->
            <div class="clearfix modal-footer1">
                <div class="pull-left">
                    <button class="btn btn-primary ng-binding" id="Validate" type="submit" tabindex="2" ng-disabled="RegisterNewLicenseKeyForm.$submitted || !RegisterNewLicenseKeyForm.$valid" disabled="disabled">Validate</button>
                </div>
                <div class="pull-right rightspace">
                   <cancel-icon title="Cancel" type="button" name="Cancel" tabindex="3" ng-click="Clear()" class="ng-isolate-scope"><div ng-class="{ &quot;has-focus&quot;: formName[name].hasFocus,
            &quot;has-success&quot;: formName[name].$valid,
            &quot;has-error&quot;: formName[name].$error.required &amp;&amp; formName.$submitted,
            &quot;has-error-pattern&quot;: formName[name].$error.pattern &amp;&amp; formName.$submitted,
            &quot;is-empty&quot;: !ngModel }" class="is-empty">
    <button class="btn btn-link btnPad t2  ng-pristine ng-untouched ng-empty ng-valid ng-valid-required" id="btnCancel" type="button" title="" ng-model="ngModel" ng-required="" ng-readonly="" autocomplete="off" spellcheck="false" tabindex="">
        <i class="fa fa-ban fa-2x " aria-hidden="true"></i>
    </button>
</div>

</cancel-icon>
                   <close-icon title="Close" type="button" name="Close" tabindex="4" ng-click="Close()" class="ng-isolate-scope"><div ng-class="{ &quot;has-focus&quot;: formName[name].hasFocus,
            &quot;has-success&quot;: formName[name].$valid,
            &quot;has-error&quot;: formName[name].$error.required &amp;&amp; formName.$submitted,
            &quot;has-error-pattern&quot;: formName[name].$error.pattern &amp;&amp; formName.$submitted,
            &quot;is-empty&quot;: !ngModel }" class="is-empty">
    <button class="btn btn-link btnPad t2 ng-pristine ng-untouched ng-empty ng-valid ng-valid-required" id="btnClose" type="button" title="" ng-model="ngModel" ng-required="" ng-readonly="" autocomplete="off" spellcheck="false" tabindex="">
        <i class="fa fa-times-circle fa-2x" aria-hidden="true"></i>
    </button>
</div>

</close-icon></div>
            </div>
            <div class="clearfix"></div>
        </form>
    </div>
</div>

下面是我试过的Protractor代码。

describe('Click on login button', function() {

      it('should navigate to Home page', function()  {

        browser.get(URL);
        browser.sleep(1000);
        browser.manage().window().maximize();

    //Register New License Key      
        element(by.id('RegisterNewLicenseKey')).click();
        browser.sleep(1000);
        element(by.id('LicenseKey')).sendKeys('LISC010102'); 
        browser.sleep(1000);
        element(by.id('Validate')).click(); 
        browser.sleep(1000);
        var message=$('#Message1').getText();
        expect(message).toBe('Please Enter Valid License Key');
        element(by.id('Close')).click(); 
    //User Login  
        element(by.id('text_User_name')).sendKeys('admin');
        element(by.id('text_userPassword')).sendKeys('welcome');
        browser.sleep(1000);
        element(by.id('btnLogin')).click();
        var title = browser.getTitle();
        browser.sleep(1000);
        expect(title).toBe('Home');

     });

    });

请建议如何捕捉“强大”中的文字。标签？在此先感谢。

Answer 1

我们遇到了类似的问题，以下是我们如何处理它的问题：

使用browser.wait()等待消息显示
关闭Protractor-Angular同步，同时执行此操作（与暂时可用的消息相关）

实施

browser.ignoreSynchronization = true;

var message = element(by.id("Message1"));
var EC = protractor.ExpectedConditions;

browser.wait(EC.visibilityOf(message), 5000);
expect(message.getText()).toEqual("Please Enter Valid License Key");

然后，在afterEach()：

中再次打开同步

afterEach(function() { 
    browser.ignoreSynchronization = false;
});

Answer 2

如果你有jquery你可以使用 $('#Message1').text()否则你可以使用 document.getElementById('Message1').innerText或 document.querySelector('#Message1').innerText

Answer 3

尝试使用xpath：

element(by.xpath(.//strong[@id='Message1']).getText();

如何从<strong>标签中提取文字？

3 个答案: