8.7 发布—WinterCG 兼容性第一部分
了解更多

关于 e2e 测试的说明

有关 e2e/集成测试的更多信息，您可以使用 Maestro 或 @nativescript/detox 插件。

在应用程序开发过程中，定期编写和执行使用 Jasmine、Mocha 与 Chai 或 QUnit 等工具的单元测试，有助于确保新功能的正常运行，并防止现有功能出现回归。

要运行您的单元测试，NativeScript CLI 使用 Karma。

开始之前 ​

在编写和运行单元测试之前，必须验证以下步骤已完成。

  1. 在您的系统上安装和配置 NativeScript CLI。

  2. 如果您没有任何项目，请创建一个新项目，然后导航到新创建目录的目录。

    cli
    ns create projectName
cd projectName

  3. 如果您要为现有目录创建测试，请导航到项目的目录。

    cli
    cd existingProjectDirectory

注意

您不需要显式添加要测试项目的平台。当您开始运行测试时，NativeScript CLI 将配置您的项目。

配置您的项目 ​

NativeScript CLI 允许您在三个广受欢迎的单元测试框架之间进行选择：Jasmine、Mocha 与 Chai 以及 QUnit。您需要通过选择一个框架来配置项目以进行单元测试。您一次只能使用一个框架。

要初始化您的项目以进行单元测试，请运行以下命令，并在出现提示时使用键盘箭头选择要使用的框架。

cli
ns test init

此操作对您的项目应用以下更改。

  • 它创建了 app/tests 目录。您需要将所有测试存储在此目录中。此目录被排除在发布构建之外。
  • 它在 app/tests 目录中创建了一个 example.js 文件。此示例测试说明了所选框架的基本语法。
  • 它在 node_modules 中为所选框架及其开发依赖项安装了 nativescript-unit-test-runner npm 模块。
  • 它在项目根目录中创建了 karma.conf.js。此文件包含所选框架的 Karma 服务器的默认配置。

注意

要为 TypeScript 或 Angular 项目启用和编写单元测试，请安装所选测试框架的 TypeScript 类型定义。

cli
npm i @types/jasmine --save-dev
cli
npm i @types/mocha --save-dev
cli
npm i @types/qunit --save-dev

编写您的测试 ​

使用 NativeScript CLI，您可以广泛测试所有与 JavaScript 相关的功能。您无法测试未通过 JavaScript 应用或创建的样式和 UI。

在为新功能或现有功能创建测试时，请牢记以下具体事项。

  • 您需要在 app/tests 目录中将测试创建为 JavaScript 文件。NativeScript CLI 将存储在 app/tests 中的 JavaScript 文件识别为单元测试。
  • 您需要编写符合您为项目选择的测试框架规范的测试。
  • 您需要在 NativeScript 项目代码中导出要测试的功能。
  • 您需要在单元测试代码中要求公开要测试的功能的模块。

在为新功能或现有功能创建测试时，请牢记以下限制。

  • 您不能要求调用 Application.run() 的文件或模块。
  • 每个项目中不能使用多个测试框架。
  • 您无法测试未通过 JavaScript 应用或创建的样式和 UI。

以下示例测试了 Hello World 模板中计数器和消息的初始值。这些测试展示了上面概述的具体事项和限制。

js
var mainViewModel = require('../main-view-model') //Require the main view model to expose the functionality inside it.

describe('Hello World Sample Test:', function () {
  it('Check counter.', function () {
    expect(mainViewModel.createViewModel().counter).toEqual(42) //Check if the counter equals 42.
  })
  it('Check message.', function () {
    expect(mainViewModel.createViewModel().message).toBe('42 taps left') //Check if the message is "42 taps left".
  })
})
js
// (Angular w/TypeScript)
// As our intention is to test an Angular component that contains annotations
// we need to include the reflect-metadata dependency.
import 'reflect-metadata'

// A sample Jasmine test
describe('A suite', function () {
  it('contains spec with an expectation', function () {
    expect(true).toBe(true)
  })
})
js
var mainViewModel = require('../main-view-model') //Require the main view model to expose the functionality inside it.

describe('Hello World Sample Test:', function () {
  it('Counter should be 42 on start.', function () {
    assert.equal(mainViewModel.createViewModel().counter, 42) //Assert that the counter equals 42.
  })
  it('Message should be "42 taps left" on start.', function () {
    assert.equal(mainViewModel.createViewModel().message, '42 taps left') //Assert that the message is "42 taps left".
  })
})
js
var mainViewModel = require('../main-view-model') //Require the main view model to expose the functionality inside it.

QUnit.test('Hello World Sample Test:', function (assert) {
  assert.equal(
    mainViewModel.createViewModel().counter,
    42,
    'Counter, 42; equal succeeds.'
  ) //Assert that the counter equals 42.
  assert.equal(
    mainViewModel.createViewModel().message,
    '42 taps left',
    'Message, 42 taps left; equal succeeds.'
  ) //Assert that the message is "42 taps left".
})

Angular TestBed 集成 ​

要使用 TestBed，您必须更改您的 karma.conf.js 为

js
// list of files / patterns to load in the browser
    files: [
      'src/tests/setup.ts',
      'src/tests/**/*.spec.ts'
    ],

对于 jasmine，src/tests/setup.ts 文件应如下所示

js
import 'nativescript-angular/zone-js/testing.jasmine'
import { nsTestBedInit } from 'nativescript-angular/testing'
nsTestBedInit()

或者如果您使用 mocha

js
import 'nativescript-angular/zone-js/testing.mocha'
import { nsTestBedInit } from 'nativescript-angular/testing'
nsTestBedInit()

然后您可以在规范文件中使用它，例如 example.spec.ts

js
import { Component, ElementRef, NgZone, Renderer2 } from '@angular/core';
import { ComponentFixture, async } from '@angular/core/testing';
import { StackLayout } from '@nativescript/core';
import {
    nsTestBedAfterEach,
    nsTestBedBeforeEach,
    nsTestBedRender
} from 'nativescript-angular/testing';

@Component({
    template: `
        <StackLayout><Label text="Layout"></Label></StackLayout>
    `
})
export class ZonedRenderer {
    constructor(public elementRef: ElementRef, public renderer: Renderer2) {}
}

describe('Renderer E2E', () => {
    beforeEach(nsTestBedBeforeEach([ZonedRenderer]));
    afterEach(nsTestBedAfterEach(false));
    afterAll(() => {});

    it('executes events inside NgZone when listen is called outside NgZone', async(() => {
        const eventName = 'someEvent';
        const view = new StackLayout();
        const eventArg = { eventName, object: view };
        const callback = arg => {
            expect(arg).toEqual(eventArg);
            expect(NgZone.isInAngularZone()).toBeTruthy();
        };
        nsTestBedRender(ZonedRenderer).then(
            (fixture: ComponentFixture<ZonedRenderer>) => {
                fixture.ngZone.runOutsideAngular(() => {
                    fixture.componentInstance.renderer.listen(
                        view,
                        eventName,
                        callback
                    );

                    view.notify(eventArg);
                });
            }
        );
    }));
});

运行您的测试 ​

完成测试套件后，您可以在物理设备或原生模拟器上运行它。

要求 ​

在运行测试之前，请验证您的开发机器和测试设备是否满足以下先决条件。

  • 要在其上运行测试的 Android 原生模拟器必须在您的开发机器上运行。要验证您的机器是否识别这些设备，请运行以下命令。

    cli
    ns device

  • 要在其上运行测试的物理设备必须连接到您的开发机器。要验证您的机器是否识别这些设备，请运行以下命令。

    cli
    ns device

  • 要在其上运行测试的物理设备必须能够解析您的开发机器的 IP。要验证设备是否可以访问 Karma 服务器，请将设备和开发机器连接到同一个 Wi-Fi 网络，或在设备和开发机器之间建立 USB 或蓝牙网络共享。

  • 您的开发机器必须允许端口 9876。Karma 服务器使用此端口与测试设备通信。

运行测试 ​

要执行连接的任何 Android 设备或运行的 Android 模拟器上的测试套件，请运行以下命令。

注意

请确保您在启动单元测试运行器之前至少准备过一次应用程序。

cli
ns test android

要执行连接的 iOS 设备上的测试套件，请运行以下命令。

cli
ns test ios

要执行 iOS 模拟器中的测试套件，请运行以下命令。

cli
ns test ios --emulator

要在 CI 中执行测试套件，请确保添加 --justlaunch。此参数将退出模拟器。

cli
ns test ios --emulator --justlaunch

每次执行 ns test 包含以下步骤，这些步骤将自动执行。

  1. CLI 在开发机器上启动一个 Karma 服务器。
  2. CLI 准备、构建和部署您的项目（如果尚未部署）。如果已部署，CLI 会同步应用程序包的更改。
  3. CLI 将 NativeScript 单元测试运行器和您的主机网络和 Karma 配置嵌入到部署的包中。
  4. CLI 启动 NativeScript 单元测试运行器的主模块，而不是启动您应用程序的主模块。
  5. NativeScript 单元测试运行器使用嵌入的网络配置尝试连接到开发机器上的 Karma 服务器。
  6. 当 NativeScript 单元测试运行器和 Karma 服务器之间的连接建立后，测试运行器将开始执行单元测试。
  7. 执行完成后，NativeScript 单元测试运行器将结果报告给 Karma 服务器。
  8. Karma 服务器在命令行上报告结果。

在代码更改时重新运行测试 ​

NativeScript 可以持续监视您的代码以查找更改，并且当出现此类更改时，它可以将这些更改部署到您的测试设备并重新运行您的测试。

要启用此行为，请使用 --watch 标志运行您的 ns test 命令。例如

cli
ns test android --watch
ns test ios --watch
ns test ios --emulator --watch

NativeScript CLI 保持活动状态，并在代码更改时重新运行测试。要解锁控制台，请按 Ctrl+C 停止进程。

配置 Karma 服务器 ​

当您为单元测试配置项目时，NativeScript CLI 将 karma.conf.js 添加到项目的根目录。此文件包含 Karma 服务器的默认配置，包括默认端口和选定的测试框架。您可以编辑此文件以自定义 Karma 服务器。

当您修改 karma.conf.js 时，请确保您的更改符合 Karma 配置文件 的规范。

持续集成 ​

要将 NativeScript 单元测试运行器集成到持续集成流程中，您需要配置一个 Karma 报告器，例如 JUnit 报告器。

下一个
更新