ng test和ng e2e之间的真正区别是什么 [英] what is the real difference between ng test and ng e2e

问题描述

恐怕有人回答了我的问题，但我找不到令人满意的问题(也许是因为我在Angular 2+的世界中非常有限，而且我理解错了).

I am afraid someone close my question but I couldn't find a satisfying question (maybe because I am very limited in Angular 2+ world and I understood something wrong).

据我所知，在完成几次Hello World和观看YouTube演示之后:

As far as I could understand after few Hello World done and few YouTube demo watched:

ng测试:

• 您使用茉莉花语言编写测试
• 您使用Karma提供的许多浏览器测试您的测试
• 您执行单元测试或集成测试
• 所有xxx.compnent.spec.ts运行，并且在浏览器中显示类似于JUnit的最终报告

• you write your test using Jasmine language
• you test your test with many Browsers available using Karma
• you execute either unit or integrated testing
• all xxx.compnent.spec.ts run and a final report similar to JUnit is showed in browser

ng e2e:

• 您使用茉莉花语言编写测试
• 您使用Karma提供的许多浏览器测试您的测试

• 您在编写测试时要牢记嵌套用户事件

• you write your test using Jasmine language
• you test your test with many Browsers available using Karma

• you write your tests with nesting user event in mind

eg. page.navigateTo();
page.getParagraphText()
  .then(msg => expect(msg).toEqual('Welcome to app!!'))
  .then(msg => expect(msg).toEqual('xxx'))
  .then(done, done.fail);

主要是在将应用程序部署为一种预生产环境之后，才使用量角器执行端到端测试

you execute End to End test using protractor mainly after deployed the application a kind of pre-production environment

从理论上讲，第二个特定于端到端，其中重点是模拟最终用户完成的整个流程.

Theoracly saying, the second is specific for end to end where the focus is to simulate a entire flow done by an end user.

希望到现在为止，我想知道在幕后发生的事情真正使他们与众不同.我不想比较哪个更好，但是我肯定会以某种方式遗漏一点，因为我使用最终用户完全相同的想法创建了很少的测试，而我却通过ng test触发了它.

Hopefully, until here is correct, I am wondering what is happening behind the scene that really make them different. I don't want to compare which is better but certainly I am missing some point somehow because I created few tests using exact same idea done by end user and I triggered it by ng test.

例如:

...

it('should display the modal when `create Paste` is clicked', () => {

    let createPasteButton = fixture.debugElement.query(By.css("button"));
    //create a spy on the createPaste  method
    spyOn(component,"createPaste").and.callThrough();

    //triggerEventHandler simulates a click event on the button object
    createPasteButton.triggerEventHandler('click',null);

    //spy checks whether the method was called
    expect(component.createPaste).toHaveBeenCalled();
    fixture.detectChanges();
    expect(component.showModal).toBeTruthy("showModal should now be true");
    expect(element.innerHTML).toContain("source-modal");
});

...

我想起我读过类似量角器在测试执行过程中提供等待/睡眠行为"的信息，但是当我看到没有量角器也能够模拟最终用户完成的测试时，我看不到此合计值在哪里.只要您对测试进行编码以执行与最终用户完全相同的流程，在Angular Cli创建的e2e文件夹下的e2e测试建议就是相同的.

I remenbered I read something like "protractor offer a waiting/sleeping behaviour during tests execution" but I can't see where this aggregate value when I see the tests done without protractor been able to simulate a final user as well. As long as you code your tests to do exact same flow done by an end user it will be same e2e test propose under e2e folder created by Angular Cli.

如果我的研究促使我正确理解上述内容，那么唯一的真正区别就是作为开发人员的我组织测试的方式.幕后没有发生任何真正的变化.

If my study drove me to correctly understanding as posted above then, the only real difference is the way I, as developer, is organizing my tests. There is nothing really different happening behind the scene.

再次，我希望看到这是为了达到教义目的而澄清的问题:这里完全没有意图比较框架.

Again, I would appreciate see this as clarifing question for didatic purpose: there is no intention to compare frameworks here at all.

推荐答案

您正在了解所有内容.

• Ng测试(通过Karma启动的Jasmine + Angular Testing实用程序测试):

您正在使用jasmine框架编写测试并将其定义为套件，并期望可以测试的结果，但主要的是，您实际上是在使用karma启动器直接在浏览器上执行测试.这通常是在角度应用程序中配置的.

You are using the jasmine framework to write your tests and define them as suites and expect results that you can test, but the main thing is that you are actually using the karma launcher to execute tests directly on the browser. This is normaly configured in the angular app.

这意味着只有一台服务器正在运行测试.您可以使用自己的值进行测试，并检查组件是否正常工作.

This means there is one server running the tests and that's it. You test with your own values and check that your components are working correctly.

目标是检查单个功能(小型测试)或单个功能/小型工作流程是否按预期正常工作且没有副作用的多个模块/组件(集成测试).

The aim is to check for single components (unit test) or several modules / components (integration tests) that a single function / small workflow is working correctly as intended without side effects.

• NG E2E(茉莉+量角器):

Protractor是Angular和AngularJS的端到端测试框架 应用程序.量角器针对您正在运行的应用程序运行测试 在真实的浏览器中，就可以与用户进行交互.

Protractor is an end-to-end test framework for Angular and AngularJS applications. Protractor runs tests against your application running in a real browser, interacting with it as a user would.

在这里，您编写的测试将充当用户.这意味着浏览器中正在运行您的应用程序，另一个程序将针对您的应用程序运行测试，以模拟用户交互.

Here, the tests you have written will act as a user. This means there is your application running in your browser, and another program will run the tests against your application, simulating a user interaction.

这非常重要，因为这意味着两件事:

This is very important, because that means two things :

1. 单元测试和集成测试使用静态的模拟数据来运行测试.
2. 量角器测试使用的是真实数据，并执行HTTP(或您正在使用的任何方法)调用以获取数据并使用/测试它.

量角器的目的是在您的应用程序中验证完整的操作流程.例如，我将为登录组件编写单元测试，为登录服务编写单元测试，为整个模块编写集成测试，以及需要测试的依赖于几个组件/服务的任何行为.完成此操作后，我将在稍后编写一个完整的端到端测试，以验证我的应用程序中的整个身份验证过程.

The aim with protractor is to validate a full operationnal workflow in your application. For example, I'll write my unit test for my login component, write an unit test for my login service, write an integration test for my whole module and whatever behavior I need to test that depends on several components / services. Once this is done, I'll write later a full end-to-end test that will validate my whole authentication process in my application.

请记住，有一个非常重要的比率对测试很重要:

Bear in mind, there is a ratio that is important about testing which is very logical :

• 单元测试应占您测试的70％.
• 集成测试应占您测试的20％.
• 端到端测试应占您测试的10％.

那是为什么?因为如果您对许多组件进行了正确的单元测试，则无需在端到端测试中再次进行测试.

Why is that ? Because if you did unit test correctly a lot of your components, you won't need to test that again in your End-to-End tests.

结论:

• 它们的操作方式不同，目的是测试不同的事物(单元功能/完整的工作流程).
• 它们是相辅相成的，这意味着，如果您仅实现单元/集成测试，则将永远无法保证工作流程从A到Z都能正常工作；而且如果您仅编写端到端测试，您将永远无法确认工作流程中没有副作用.

N.B. :还要注意以下几点:

• 茉莉，因果和量角器可以随意定制，因此您可以将它们输出为可以由Jenkins作业处理的XML文件，而不是不实际的命令行.
• 是的，您可以为两者编写相同的代码并有效地测试同一件事，但是请记住，您想要的是提高效率并编写可维护的测试代码.我所说的比率非常重要.

希望这会有所帮助.

这篇关于ng test和ng e2e之间的真正区别是什么的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！