gotoDetail() => _router.navigate([
+ 'HeroDetail',
+ {'id': selectedHero.id.toString()}
+ ]);
+}
diff --git a/lib/src/heroes_component.html b/lib/src/heroes_component.html
new file mode 100644
index 0000000..27cdf99
--- /dev/null
+++ b/lib/src/heroes_component.html
@@ -0,0 +1,22 @@
+My Heroes
+
+
+
+
+
+ -
+ {{hero.id}}
+ {{hero.name}}
+
+
+
+
+
+ {{selectedHero.name | uppercase}} is my hero
+
+
+
diff --git a/pubspec.yaml b/pubspec.yaml
new file mode 100644
index 0000000..2a8babb
--- /dev/null
+++ b/pubspec.yaml
@@ -0,0 +1,27 @@
+name: angular_tour_of_heroes
+description: Tour of Heroes
+version: 0.0.1
+environment:
+ sdk: '>=1.24.0 <2.0.0'
+dependencies:
+ angular: ^4.0.0
+ angular_forms: ^1.0.0
+ angular_router: ^1.0.2
+ http: ^0.11.0
+ stream_transform: ^0.0.6
+
+dev_dependencies:
+ angular_test: ^1.0.0
+ browser: ^0.10.0
+ dart_to_js_script_rewriter: ^1.0.1
+ mockito: ^2.0.2
+ test: ^0.12.21
+
+transformers:
+- angular:
+ entry_points:
+ - web/main.dart
+ - test/**_test.dart
+- test/pub_serve:
+ $include: test/**_test.dart
+- dart_to_js_script_rewriter
diff --git a/test/README.md b/test/README.md
new file mode 100644
index 0000000..cb4d4b2
--- /dev/null
+++ b/test/README.md
@@ -0,0 +1,7 @@
+Changes/additions relative to toh-5:
+
+- Test bed: add provider for `Client`.
+- Reset (mock) DB during setup.
+- Test waiting for element update before proceeding.
+- Test interaction with (mock) db backend.
+- Use `@WithVisibleText()` PO field annotation.
\ No newline at end of file
diff --git a/test/all_test.dart b/test/all_test.dart
new file mode 100644
index 0000000..036e63e
--- /dev/null
+++ b/test/all_test.dart
@@ -0,0 +1,19 @@
+@Tags(const ['aot'])
+@TestOn('browser')
+library heroes_test;
+
+import 'package:angular/angular.dart';
+import 'package:test/test.dart';
+
+import 'dashboard.dart' as dashboard;
+import 'heroes.dart' as heroes;
+import 'hero_detail.dart' as hero_detail;
+import 'hero_search.dart' as hero_search;
+
+@AngularEntrypoint()
+void main() {
+ group('dashboard:', dashboard.main);
+ group('heroes:', heroes.main);
+ group('hero detail:', hero_detail.main);
+ group('hero search:', hero_search.main);
+}
diff --git a/test/all_test.html b/test/all_test.html
new file mode 100644
index 0000000..4c191d1
--- /dev/null
+++ b/test/all_test.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+ Tests
+
+
+
+
+
+
+
+
+
+
diff --git a/test/app_po.dart b/test/app_po.dart
new file mode 100644
index 0000000..0fbcce6
--- /dev/null
+++ b/test/app_po.dart
@@ -0,0 +1,17 @@
+import 'dart:async';
+
+import 'package:pageloader/objects.dart';
+import 'utils.dart';
+
+class AppPO {
+ @ByTagName('h1')
+ PageLoaderElement _h1;
+
+ @ByCss('nav a')
+ List _tabLinks;
+
+ Future get pageTitle => _h1.visibleText;
+
+ Future> get tabTitles =>
+ inIndexOrder(_tabLinks.map((el) => el.visibleText)).toList();
+}
diff --git a/test/app_test.dart b/test/app_test.dart
new file mode 100644
index 0000000..b67827c
--- /dev/null
+++ b/test/app_test.dart
@@ -0,0 +1,55 @@
+@Skip('AppComponent tests need bootstrap equivalent for the Router init')
+@Tags(const ['aot'])
+@TestOn('browser')
+
+import 'package:angular/angular.dart';
+import 'package:angular_router/angular_router.dart';
+import 'package:angular_test/angular_test.dart';
+import 'package:angular_tour_of_heroes/app_component.dart';
+import 'package:mockito/mockito.dart';
+import 'package:test/test.dart';
+
+import 'app_po.dart';
+
+NgTestFixture fixture;
+AppPO appPO;
+
+final mockPlatformLocation = new MockPlatformLocation();
+
+class MockPlatformLocation extends Mock implements PlatformLocation {}
+
+@AngularEntrypoint()
+void main() {
+ final providers = [
+ provide(APP_BASE_HREF, useValue: '/'),
+ provide(ROUTER_PRIMARY_COMPONENT, useValue: AppComponent),
+ provide(PlatformLocation, useValue: mockPlatformLocation),
+ ];
+
+ final testBed = new NgTestBed().addProviders(providers);
+
+ setUpAll(() async {
+ // Seems like we'd need to do something equivalent to:
+ // bootstrap(AppComponent);
+ });
+
+ setUp(() async {
+ fixture = await testBed.create();
+ appPO = await fixture.resolvePageObject(AppPO);
+ });
+
+ tearDown(disposeAnyRunningTest);
+
+ group('Basics:', basicTests);
+}
+
+void basicTests() {
+ test('page title', () async {
+ expect(await appPO.pageTitle, 'Tour of Heroes');
+ });
+
+ test('tab titles', () async {
+ final expectTitles = ['Dashboard', 'Heroes'];
+ expect(await appPO.tabTitles, expectTitles);
+ });
+}
diff --git a/test/dashboard.dart b/test/dashboard.dart
new file mode 100644
index 0000000..313bd2c
--- /dev/null
+++ b/test/dashboard.dart
@@ -0,0 +1,91 @@
+@Tags(const ['aot'])
+@TestOn('browser')
+
+import 'dart:async';
+import 'package:angular/angular.dart';
+import 'package:angular_router/angular_router.dart';
+import 'package:angular_test/angular_test.dart';
+import 'package:angular_tour_of_heroes/app_component.dart';
+import 'package:angular_tour_of_heroes/in_memory_data_service.dart';
+import 'package:angular_tour_of_heroes/src/dashboard_component.dart';
+import 'package:angular_tour_of_heroes/src/hero_service.dart';
+import 'package:http/http.dart';
+import 'package:mockito/mockito.dart';
+import 'package:test/test.dart';
+
+import 'dashboard_po.dart';
+
+NgTestFixture fixture;
+DashboardPO po;
+
+final mockPlatformLocation = new MockPlatformLocation();
+
+class MockPlatformLocation extends Mock implements PlatformLocation {}
+
+@AngularEntrypoint()
+void main() {
+ final providers = new List.from(ROUTER_PROVIDERS)
+ ..addAll([
+ provide(APP_BASE_HREF, useValue: '/'),
+ provide(Client, useClass: InMemoryDataService),
+ provide(ROUTER_PRIMARY_COMPONENT, useValue: AppComponent),
+ provide(PlatformLocation, useValue: mockPlatformLocation),
+ HeroService,
+ ]);
+ final testBed = new NgTestBed().addProviders(providers);
+
+ setUpAll(() async {
+ when(mockPlatformLocation.pathname).thenReturn('');
+ when(mockPlatformLocation.search).thenReturn('');
+ when(mockPlatformLocation.hash).thenReturn('');
+ when(mockPlatformLocation.getBaseHrefFromDOM()).thenReturn('');
+ });
+
+ setUp(() async {
+ fixture = await testBed.create();
+ po = await fixture.resolvePageObject(DashboardPO);
+ });
+
+ tearDown(disposeAnyRunningTest);
+
+ test('title', () async {
+ expect(await po.title, 'Top Heroes');
+ });
+
+ test('show top heroes', () async {
+ final expectedNames = ['Narco', 'Bombasto', 'Celeritas', 'Magneta'];
+ expect(await po.heroNames, expectedNames);
+ });
+
+ test('select hero and navigate to detail', () async {
+ clearInteractions(mockPlatformLocation);
+ await po.selectHero(3);
+ final c = verify(mockPlatformLocation.pushState(any, any, captureAny));
+ expect(c.captured.single, '/detail/15');
+ });
+
+ test('no search no heroes', () async {
+ expect(await po.heroesFound, []);
+ });
+
+ group('Search hero:', heroSearchTests);
+}
+
+void heroSearchTests() {
+ final matchedHeroNames = [
+ 'Magneta',
+ 'RubberMan',
+ 'Dynama',
+ 'Magma',
+ ];
+
+ setUp(() async {
+ await po.search.type('ma');
+ await new Future.delayed(const Duration(seconds: 1));
+ po = await fixture.resolvePageObject(DashboardPO);
+ });
+
+ test('list matching heroes', () async {
+ expect(await po.heroesFound, matchedHeroNames);
+ });
+}
diff --git a/test/dashboard_po.dart b/test/dashboard_po.dart
new file mode 100644
index 0000000..a02b10c
--- /dev/null
+++ b/test/dashboard_po.dart
@@ -0,0 +1,31 @@
+import 'dart:async';
+
+import 'package:pageloader/objects.dart';
+import 'utils.dart';
+
+class DashboardPO {
+ @FirstByCss('h3')
+ PageLoaderElement _title;
+
+ @ByTagName('a')
+ List _heroes;
+
+ @ByTagName('input')
+ PageLoaderElement search;
+
+ @ByCss('div[id="search-component"] div div')
+ List _heroesFound;
+
+ @ByCss('div[id="search-component"]')
+ PageLoaderElement heroSearchDiv;
+
+ Future get title => _title.visibleText;
+
+ Future> get heroNames =>
+ inIndexOrder(_heroes.map((el) => el.visibleText)).toList();
+
+ Future selectHero(int index) => _heroes[index].click();
+
+ Future> get heroesFound =>
+ inIndexOrder(_heroesFound.map((el) => el.visibleText)).toList();
+}
diff --git a/test/hero_detail.dart b/test/hero_detail.dart
new file mode 100644
index 0000000..b1a8c2e
--- /dev/null
+++ b/test/hero_detail.dart
@@ -0,0 +1,98 @@
+@Tags(const ['aot'])
+@TestOn('browser')
+
+import 'package:angular/angular.dart';
+import 'package:angular_router/angular_router.dart';
+import 'package:angular_test/angular_test.dart';
+import 'package:angular_tour_of_heroes/in_memory_data_service.dart';
+import 'package:angular_tour_of_heroes/src/hero_detail_component.dart';
+import 'package:angular_tour_of_heroes/src/hero_service.dart';
+import 'package:http/http.dart';
+import 'package:mockito/mockito.dart';
+import 'package:test/test.dart';
+
+import 'hero_detail_po.dart';
+
+NgTestFixture fixture;
+HeroDetailPO po;
+
+class MockPlatformLocation extends Mock implements PlatformLocation {}
+
+final mockPlatformLocation = new MockPlatformLocation();
+
+@AngularEntrypoint()
+void main() {
+ final baseProviders = new List.from(ROUTER_PROVIDERS)
+ ..addAll([
+ provide(APP_BASE_HREF, useValue: '/'),
+ provide(Client, useClass: InMemoryDataService),
+ provide(PlatformLocation, useValue: mockPlatformLocation),
+ provide(RouteParams, useValue: new RouteParams({})),
+ HeroService,
+ ]);
+ final testBed =
+ new NgTestBed().addProviders(baseProviders);
+
+ setUp(() {
+ InMemoryDataService.resetDb();
+ });
+
+ tearDown(disposeAnyRunningTest);
+
+ test('No initial hero results in an empty view', () async {
+ fixture = await testBed.create();
+ expect(fixture.rootElement.text.trim(), '');
+ });
+
+ const targetHero = const {'id': 15, 'name': 'Magneta'};
+
+ group('${targetHero['name']} initial hero:', () {
+ const nameSuffix = 'X';
+ final Map updatedHero = {
+ 'id': targetHero['id'],
+ 'name': "${targetHero['name']}$nameSuffix"
+ };
+
+ setUp(() async {
+ final groupTestBed = testBed.fork().addProviders([
+ provide(RouteParams,
+ useValue: new RouteParams({'id': targetHero['id'].toString()}))
+ ]);
+ fixture = await groupTestBed.create();
+ po = await fixture.resolvePageObject(HeroDetailPO);
+ });
+
+ test('show hero details', () async {
+ expect(await po.heroFromDetails, targetHero);
+ });
+
+ test('back button', () async {
+ await po.back();
+ verify(mockPlatformLocation.back());
+ });
+
+ group('Update name:', () {
+ setUp(() async {
+ await po.type(nameSuffix);
+ });
+
+ test('show updated name', () async {
+ expect(await po.heroFromDetails, updatedHero);
+ });
+
+ test('discard changes', () async {
+ await po.back();
+ verify(mockPlatformLocation.back());
+ final name = InMemoryDataService.lookUpName(targetHero['id']);
+ expect(name, targetHero['name']);
+ });
+
+ test('save changes and go back', () async {
+ await po.save();
+ verify(mockPlatformLocation.back());
+ final name = InMemoryDataService.lookUpName(targetHero['id']);
+ expect(name, updatedHero['name']);
+ });
+ });
+ });
+}
diff --git a/test/hero_detail_po.dart b/test/hero_detail_po.dart
new file mode 100644
index 0000000..b09d38d
--- /dev/null
+++ b/test/hero_detail_po.dart
@@ -0,0 +1,37 @@
+import 'dart:async';
+
+import 'package:pageloader/objects.dart';
+import 'utils.dart';
+
+class HeroDetailPO {
+ @FirstByCss('div h2')
+ PageLoaderElement _title; // e.g. 'Mr Freeze details!'
+
+ @FirstByCss('div div')
+ PageLoaderElement _id;
+
+ @ByTagName('input')
+ PageLoaderElement _input;
+
+ @ByTagName('button')
+ @WithVisibleText('Back')
+ PageLoaderElement _back;
+
+ @ByTagName('button')
+ @WithVisibleText('Save')
+ PageLoaderElement _save;
+
+ Future