Angularjs SweetAlert按钮未正确单击-角度/量角器

我正在一个Angular应用程序上运行一些CRUD功能测试。它背后的基本思想是有3个按钮。创建、编辑和删除。请记住，所有这些功能都在UI中工作。“创建”和“编辑”按钮打开模式并提交信息。提交该信息后，会弹出一个SweetAlert，告诉用户它成功了，测试会单击OK按钮。对于这两种情况，它工作得很好

但是，删除按钮有一个问题。单击它时，它会进入一个屏幕，您可以在其中选择（.cancel）按钮和（.confirm）按钮。它会查找按钮，但不会出于任何原因执行.click（）。所以我可以创建/编辑内容，但不能删除它，因为这个按钮不会点击。知道为什么吗

以下是警报的图片：

以下是此特定页面的测试：

describe('Main CRUD Banners Page', function() {

  var create_edit = element.all(by.model('vm.create'));
  var remove = element.all(by.css('button[ng-  click="vm.deleteMainBanner(banner)"]'));
  var modal_title = element(by.css('.modal-header h3'));
  var name = element(by.css('input[placeholder="Name"]'));
  var author = element(by.css('input[placeholder="Author"]'));
  var title = element(by.css('input[placeholder="Title"]'));
  var date = element(by.css('input[placeholder="Date"]'));
  var submit = element(by.css('button[ng-click="vm.submit()"]'));
  var submit_confirmation = element(by.css('p[style="display: block;"]'));
  var button_confirmation = element(by.css('.confirm'));
  var new_banner_name = element.all(by.binding(' banner.name ')).last();
  var new_banner_author = element.all(by.binding(' banner.author ')).last();
  var delete_confirm = element(by.buttonText('Yes Delete'));

  function createContent(test_name, test_author, test_title, test_date) {
      name.sendKeys(test_name);
      author.sendKeys(test_author);
      title.sendKeys(test_title);
      date.sendKeys(test_date);
      submit.click();
  }

  beforeEach(function(){
      browser.get('http://localhost:3444/ind_page/content/mainbanner');
  });

  it('should be logged in on main banner page', function(){
      expect(element(by.binding(' app.username   ')).getText()).toContain('jonathan');
     expect(browser.getCurrentUrl()).toMatch('http://localhost:3444/ind_page/content/mainbanner');
  });

  it('should open a create modal and submit main banner content',   function(){
      create_edit.first().click();
      //expect(modal_title.getText()).toBe('Create Content');
      createContent('test_banner', 'jay', 'Get Fit, Make Money', '12/14/15');
      expect(submit_confirmation.getText()).toContain('Complete');
      button_confirmation.click();
      expect(new_banner_name.getText()).toBe('test_banner');
  });

  it('should open an edit modal and submit changes to main banner content', function(){
      create_edit.last().click();
      //expect(modal_title.getText()).toBe('test_banner');
      author.clear().sendKeys('test_author');
      submit.click();
      expect(submit_confirmation.getText()).toContain('Complete');
      button_confirmation.click();
      expect(new_banner_author.getText()).toBe('test_author');
  });

  it('should delete main banner content', function(){
      remove.last().click()
      expect(submit_confirmation.getText()).toContain('You will not be able to recover this record');
      delete_confirm.click();
      expect(submit_confirmation.getText()).toContain('The record has been deleted');
      button_confirmation.click();
  });

});

HTML-

<div class="panel panel-primary">
    <div class="panel-heading banner-title">Main Banners Posted</div>
    <div class="panel-body" style="height:420px;overflow:auto">
        <table class="table table-striped">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Image</th>
                    <th>Author</th>
                    <th>Date</th>
                    <th><a ng-click="vm.create=true;vm.fields[0].disabled=false;vm.mainBannerManagement()"
                        ng-model="vm.create">
                        <span class="glyphicon glyphicon-plus"></span>
                    </a>
                </th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="banner in vm.main_banners | orderBy: 'name'">
                <td>{{ banner.name }}</td>
                <td>{{ banner.thumbnail_picture_url }}</td>
                <td>{{ banner.author }}</td>
                <td>{{ banner.date }}</td>
                <td>
                    <button ng-click="vm.create=false;vm.fields[0].disabled=true;vm.mainBannerModelUpdate(banner);vm.mainBannerManagement()"
                            ng-model="vm.create"
                            type="button" class="btn btn-primary">
                        <span class="glyphicon glyphicon-eye-open"></span>
                    </button>
                    <button ng-click="vm.deleteMainBanner(banner)" class="btn btn-danger">
                        <span class="glyphicon glyphicon-trash"></span>
                    </button>
                </td>
            </tr>
        </tbody>
    </table>
</div>

---

可能您的量角器正在尝试在渲染警报之前单击。。你能显示错误信息吗

您应该尝试为您的模式警报提供一个id，并等待它在量角器（示例如下）的预期条件下可见，或者只等待删除按钮可单击：

var EC = protractor.ExpectedConditions; 
// Do your stuff ... 
// Then wait button to be visible and enabled  
browser.wait(EC.elementToBeClickable(delete_confirm), 5000).then(function(){
    expect(submit_confirmation.getText()).toContain('You will not be able to recover this record');
    delete_confirm.click();
});

请记住，量角器是异步工作的，为了确保所有测试都是稳定的，请在每次新渲染后等待一个条件。否则，您可能会遇到加载程序或背景的问题

var myBackdrop = element(by.id(backdropId));
browser.wait(EC.invisibilityOf(myBackdrop), 5000);

看看这一页，这可以解决e2e测试中的大多数随机故障

---

更新帖子： 如果问题仍然存在，请使用以下技巧之一：

delete_confirm.click().click();
// or 
browser.executeScript("arguments[0].scrollIntoView();", delete_confirm);
// or
browser.actions().mouseMove(delete_confirm).click().perform();

---

圣诞快乐，希望能有所帮助；）

它目前是如何失败的？此外，请张贴删除确认“弹出窗口”的HTML代码。谢谢。将HTML/JS添加到我的原始帖子中。测试在技术上并没有失败，至少在测试套件上是这样，但它没有正确地完成它应该做的事情。它应该单击确认按钮，该按钮会自动从内容列表中删除该项。（这是我在UI中手动执行时发生的情况）。我在console.log中放置了一个警报，看看它是否在量角器运行时发出，而不是（手动执行时发出）。感谢您的回复。我来试试看。没有实际的错误消息，所以很难理解。我只知道它不起作用，因为当我回到内容索引时，那部分内容仍然在列表中，但它应该已经不存在了。用EC/wait之类的东西试用一下。它仍然不起作用。按钮正在渲染，可以单击。我链接了另一个。请等待第二个警报屏幕，该屏幕在您单击“删除\确认”按钮后应立即关闭，以检查是否有显示“确定”的按钮，并显示“记录已删除”的消息。这是直截了当的，不执行。我不知道为什么。嗯，奇怪的行为，你试图改变属性元素（by.buttonText（'yesdelete'）；由另一个，如by.id或by.css？？否则，请尝试browser.debugger（），单击“删除”按钮后，使用e2e调试属性启动ProActor并打开（F12）控制台以查看是否发生错误。浏览器。睡眠（60000）；如果速度足够快，也可以工作^^进行了大量调试。还是什么也找不到。最奇怪的是，所有的测试都通过了“Firefox”，包括删除，除删除之外的所有测试都在“Chrome”中运行。所以这似乎是Chrome的一个问题。不知道如何调试，因为没有出现错误。好的，恼人的问题^^，所以也许检查webdriver管理器版本和量角器版本可以帮助，selenium server单机版和chrome驱动程序版本是什么？您能将它们分别更新到更新的版本2.48.2和2.20吗？

delete_confirm.click().click();
// or 
browser.executeScript("arguments[0].scrollIntoView();", delete_confirm);
// or
browser.actions().mouseMove(delete_confirm).click().perform();