小编red*_*r13的帖子

这是： cy.get('[name=planSelect]').contains(dummyPlan)

等效于此： cy.get('[name=planSelect]').should('contain', dummyPlan)

如果是这样，哪个是首选？首先是更多的隐式断言，但在我看来更短，更清晰。

后续问题：环顾四周以了解如何最好地选择用于e2e测试的元素后，我发现Cypress文档建议使用data-cy属性。是否有理由比仅将name属性添加到标记更好？应该name只用于表单字段吗？

这似乎是一个相当常见且不花哨的用例，但我以前没有遇到过。我设置了一支笔，但无法在那里复制它，我正在揪着我的头发试图找出原因。

演示笔

左侧边栏有一个用于项目列表的自定义滚动窗口，但尽管设置为我提供了一个很好的可滚动列表，但如果未设置为滚动，overflow-y: scroll它也会创建一个等于左侧列表高度的巨大空白块overflow-y。该空白位于 HTML 标记之外（并且因为蓝色背景停止）。因此，高度计算似乎发生了一些事情，但我只是不知道我还能玩什么。

在我的应用程序中，我尝试在内容包装器上注释掉 和overflow-y，display: grid并且在执行任一操作后，空白都会消失。但当然我需要这两个属性。我需要在某处设置另一个高度吗？

这看起来很简单,我确信我不会在某处导入某些东西,但我已经尝试了所有模块,包括测试,但没有运气.测试失败,出现此错误:

"exportAs"设置为"ngbDatepicker"没有指令(占位符="一年前"[(ngModel)] ="fromDate"ngbDatepicker [错误 - >] #fromDateToggle ="ngbDatepicker"title ="选择日期">

我有一个组件模板,ng-bootstrap在弹出窗口中使用datepicker(根据他们的文档)

我的模板代码如下:

<div class="input-group">
  <input id="to-date" name="dp" class="form-control" placeholder="yyyy-mm-dd" name="dp" [(ngModel)]="toDate"
    ngbDatepicker #toDateToggle="ngbDatepicker" title="Select a date">
  <button class="input-group-addon" (click)="toDateToggle.toggle()" type="button">
    <span class="fa fa-calendar"></span>
  </button>
</div>

我已经NgbModule.forRoot()在我的spec文件中app.module.ts导入NgbModule了,这似乎是指南所需的全部内容.

我的spec文件:

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
import { By } from '@angular/platform-browser';
import { NgbModule, NgbActiveModal, NgbDateStruct } from '@ng-bootstrap/ng-bootstrap';
import { ExtractModalComponent …

我正在关注howtographql.com上的教程，该教程创建了一个非常基本的 GraphQL 服务器，其中包含内存数据和用 JavaScript 编写的解析器。我一直遇到问题，我希望能够在解析器中放置一个断点，但是当我运行 GraphQL playground GUI 时，我在 DevTools 的 Sources 面板中看不到任何内容，并在其中添加了debugger一行代码也不会阻止它。

如何调试我的解析器？

架构

type Mutation {
  updateLink(id: ID!, url: String, description: String): Link
}

解析器（我使用的是 immutable.js 的 Map；可能不正确）

let links = [
  {
    id: "link-0",
    url: "www.howtographql.com",
    description: "Fullstack tutorial for GraphQL",
  },
]

const resolvers = {
  Mutation: {
    updateLink(root, args) {
      const linkIndex = links.findIndex(link => link.id === args.id);
      const state = links.map(link => {
        debugger;
        if (link.id === args.id) { …

我一直在尝试一些事情，并且在Angular文档上待了一个多小时，但仍然无法通过此测试。我正在使用Jest（与Jasmine非常相似）。问题是，当我时，它正在应用程序中运行ng serve，我只是无法为此编写通过测试！

HTML模板

 id="typeahead-plan"
   placeholder="search"
   type="text" class="form-control br--top"
   [(ngModel)]="selections.clientId"
   [ngbTypeahead]="searchClients"
   (input)="resetFileId()"
   (blur)="filterFileIds()"
   (keyup.enter)="filterFileIds()"
   (selectItem)="selectClientPlan($event.target.value)" />

规格

test('Submit button is disabled when changing plan', () => {
  component.resetFileId = jest.fn();
  fixture.detectChanges();
  const submitEl = fixture.debugElement.query(
    By.css('button[data-test=submit]')
  );
  const planInputEl = fixture.debugElement.query(By.css('#typeahead-plan'));
  expect(submitEl.nativeElement.attributes['disabled']).not.toBeDefined();

  planInputEl.nativeElement.value = 'd';
  planInputEl.triggerEventHandler('input', null);
  fixture.detectChanges();
  expect(component.resetFileId).toHaveBeenCalled();
  expect(submitEl.nativeElement.attributes['disabled']).toBeTruthy();
});

该测试表明该间谍应该被调用，但从未被调用，因此使我认为我没有正确触发输入事件。如果我注释掉该toHaveBeenCalled断言，则下一个断言将失败，因为“提交”按钮没有disabled属性。再次，手动单击UI都可以正常工作，只是不在测试中。当我尝试学习如何编写测试时，这种事情不断抬头，这确实使我感到沮丧并拖慢了我的开发速度。