build(components-e2e): Bazelify components-e2e app.

.bazelrc

@@ -100,7 +100,11 @@ build --strategy=AngularTemplateCompile=worker
 
 # Use the Angular Ivy compiler
 # See https://github.com/angular/angular/blob/master/docs/BAZEL.md#various-flags-used-for-tests
-# build --define=angular_ivy_enabled=False
+build:view-engine --define=angular_ivy_enabled=False
+build:ivy --define=angular_ivy_enabled=True
+
+# Set Ivy as the default
+build --config=view-engine
 
 # Angular Architect (Angular CLI)
 # The Angular CLI will by default try to write to a cache, but under Bazel it's a read only fs

WORKSPACE

@@ -39,6 +39,7 @@ http_archive(
         "https://github.com/bazelbuild/rules_sass/archive/%s.zip" % RULES_SASS_VERSION,
         "https://mirror.bazel.build/github.com/bazelbuild/rules_sass/archive/%s.zip" % RULES_SASS_VERSION,
     ],
+    patches = [ "//:rules_sass-pr-122.patch"]
 )
 
 ###########################################

apps/components-e2e/BUILD.bazel

@@ -1,9 +1,14 @@
-load("//tools/bazel_rules:index.bzl", "stylelint")
+load("@npm//@bazel/typescript:index.bzl", "ts_config")
 
-package(default_visibility = ["//:__subpackages__"])
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
 
-stylelint(
-    name = "stylelint",
-    srcs = glob(["**/*.scss"]),
-    config = ":.stylelintrc"
+exports_files([".stylelintrc"])
+
+ts_config(
+    name = "tsconfig-app",
+    src = ":tsconfig.app.json",
+    deps = [
+        ":tsconfig.json",
+        "//:tsconfig.base.json",
+    ],
 )

apps/components-e2e/src/BUILD.bazel

@@ -0,0 +1,34 @@
+load("//tools/bazel_rules:index.bzl", "ng_module", "stylelint")
+load("@io_bazel_rules_sass//:defs.bzl", "sass_binary")
+
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
+
+ng_module(
+    name = "src",
+    srcs = [
+        "main.dev.ts",
+        "main.prod.ts",
+    ],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        "//apps/components-e2e/src/app",
+        "@npm//@angular/core",
+        "@npm//@angular/platform-browser",
+    ],
+)
+
+sass_binary(
+    name = "styles",
+    src = "main.scss",
+    include_paths = ["external/npm"],
+    output_name = "styles.css",
+    deps = [
+        "//libs/barista-components/style",
+    ],
+)
+
+stylelint(
+    name = "stylelint",
+    srcs = glob(["**/*.scss"]),
+    config = "//apps/components-e2e:.stylelintrc",
+)

apps/components-e2e/src/app/BUILD.bazel

@@ -0,0 +1,55 @@
+load("//tools/bazel_rules:index.bzl", "ng_module")
+
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
+
+ROUTES = [
+    "//apps/components-e2e/src/components/autocomplete",
+    "//apps/components-e2e/src/components/button",
+    "//apps/components-e2e/src/components/button-group",
+    "//apps/components-e2e/src/components/chart",
+    "//apps/components-e2e/src/components/checkbox",
+    "//apps/components-e2e/src/components/combobox",
+    "//apps/components-e2e/src/components/confirmation-dialog",
+    "//apps/components-e2e/src/components/consumption",
+    "//apps/components-e2e/src/components/context-dialog",
+    "//apps/components-e2e/src/components/drawer",
+    "//apps/components-e2e/src/components/empty-state",
+    "//apps/components-e2e/src/components/event-chart",
+    "//apps/components-e2e/src/components/expandable-panel",
+    "//apps/components-e2e/src/components/expandable-section",
+    "//apps/components-e2e/src/components/filter-field",
+    "//apps/components-e2e/src/components/highlight",
+    "//apps/components-e2e/src/components/key-value-list",
+    "//apps/components-e2e/src/components/overlay",
+    "//apps/components-e2e/src/components/pagination",
+    "//apps/components-e2e/src/components/progress-bar",
+    "//apps/components-e2e/src/components/quick-filter",
+    "//apps/components-e2e/src/components/radial-chart",
+    "//apps/components-e2e/src/components/radio",
+    "//apps/components-e2e/src/components/select",
+    "//apps/components-e2e/src/components/show-more",
+    "//apps/components-e2e/src/components/slider",
+    "//apps/components-e2e/src/components/stacked-series-chart",
+    "//apps/components-e2e/src/components/sunburst-chart",
+    "//apps/components-e2e/src/components/switch",
+    "//apps/components-e2e/src/components/table",
+    "//apps/components-e2e/src/components/tabs",
+    "//apps/components-e2e/src/components/tag",
+    "//apps/components-e2e/src/components/tile",
+    "//apps/components-e2e/src/components/tree-table",
+]
+
+ng_module(
+    name = "app",
+    srcs = glob(["*.ts"]),
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = ROUTES + [
+        "//libs/barista-components/icon:compile",
+        "//libs/barista-components/overlay:compile",
+        "@npm//@angular/common",
+        "@npm//@angular/core",
+        "@npm//@angular/forms",
+        "@npm//@angular/platform-browser",
+        "@npm//@angular/router",
+    ],
+)

apps/components-e2e/src/app/app.module.ts

@@ -20,9 +20,9 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { BrowserModule } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { DtIconModule } from '@dynatrace/barista-components/icon';
+import { DtOverlayModule } from '@dynatrace/barista-components/overlay';
 import { DtE2EApp } from './app.component';
 import { AppRoutingModule } from './app.routing.module';
-import { DtOverlayModule } from '@dynatrace/barista-components/overlay';
 
 @NgModule({
   declarations: [DtE2EApp],
@@ -32,8 +32,8 @@ import { DtOverlayModule } from '@dynatrace/barista-components/overlay';
     ReactiveFormsModule,
     HttpClientModule,
     DtIconModule.forRoot({ svgIconLocation: '/assets/icons/{{name}}.svg' }),
-    AppRoutingModule,
     DtOverlayModule,
+    AppRoutingModule,
   ],
   bootstrap: [DtE2EApp],
 })

apps/components-e2e/src/app/app.routing.module.ts

@@ -209,9 +209,9 @@ export const routes: Routes = [
       ),
   },
   {
-    path: 'table-order',
+    path: 'table',
     loadChildren: () =>
-      import('../components/table-order/table.module').then(
+      import('../components/table/table.module').then(
         (module) => module.DtE2ETableModule,
       ),
   },

apps/components-e2e/src/components/autocomplete/BUILD.bazel

@@ -0,0 +1,24 @@
+load("//tools/bazel_rules:index.bzl", "ng_module")
+
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
+
+ng_module(
+    name = "autocomplete",
+    srcs = glob(
+        include = ["**/*.ts"],
+        exclude = [
+            "**/*.po.ts",
+            "**/*.e2e.ts",
+        ],
+    ),
+    angular_assets = ["autocomplete.html"],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        "//libs/barista-components/autocomplete:compile",
+        "//libs/barista-components/core:compile",
+        "@npm//@angular/common",
+        "@npm//@angular/core",
+        "@npm//@angular/forms",
+        "@npm//@angular/router",
+    ],
+)

apps/components-e2e/src/components/button-group/BUILD.bazel

@@ -0,0 +1,23 @@
+
+load("//tools/bazel_rules:index.bzl", "ng_module")
+
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
+
+ng_module(
+    name = "button-group",
+    srcs = glob(
+        include = ["**/*.ts"],
+        exclude = [
+            "**/*.po.ts",
+            "**/*.e2e.ts",
+        ],
+    ),
+    angular_assets = ["button-group.html"],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        "//libs/barista-components/button-group:compile",
+        "@npm//@angular/common",
+        "@npm//@angular/core",
+        "@npm//@angular/router",
+    ],
+)

apps/components-e2e/src/components/button/BUILD.bazel

@@ -0,0 +1,23 @@
+
+load("//tools/bazel_rules:index.bzl", "ng_module")
+
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
+
+ng_module(
+    name = "button",
+    srcs = glob(
+        include = ["**/*.ts"],
+        exclude = [
+            "**/*.po.ts",
+            "**/*.e2e.ts",
+        ],
+    ),
+    angular_assets = ["button.html"],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        "//libs/barista-components/button:compile",
+        "@npm//@angular/common",
+        "@npm//@angular/core",
+        "@npm//@angular/router",
+    ],
+)

apps/components-e2e/src/components/chart/BUILD.bazel

@@ -0,0 +1,57 @@
+load("//tools/bazel_rules:index.bzl", "ng_module")
+load("@npm//@bazel/typescript:index.bzl", "ts_library")
+
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
+
+ng_module(
+    name = "chart",
+    srcs = glob(
+        include = ["**/*.ts"],
+        exclude = [
+            "chart-base.ts",
+            "chart-options.ts",
+            "**/*.po.ts",
+            "**/*.e2e.ts",
+        ],
+    ),
+    angular_assets = [
+        "chart/chart.html",
+        "heatfield/heatfield.html",
+        "highcharts/chart-highcharts-ui.html",
+        "pie-chart/pie-chart.html",
+    ],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        "//apps/components-e2e/src/components/chart/selection-area",
+        "//libs/barista-components/chart:compile",
+        "//libs/barista-components/core:compile",
+        "//libs/testing/fixtures",
+        "@npm//@angular/common",
+        "@npm//@angular/core",
+        "@npm//@angular/router",
+        "@npm//highcharts",
+        "@npm//rxjs",
+    ],
+)
+
+ts_library(
+    name = "chart-base",
+    srcs = ["chart-base.ts"],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        ":chart-options",
+        "//apps/components-e2e/src/services",
+        "@npm//highcharts",
+        "@npm//rxjs",
+        "@npm//tslib",
+    ],
+)
+
+ts_library(
+    name = "chart-options",
+    srcs = ["chart-options.ts"],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        "@npm//tslib",
+    ],
+)

apps/components-e2e/src/components/chart/selection-area/BUILD.bazel

@@ -0,0 +1,29 @@
+load("//tools/bazel_rules:index.bzl", "ng_module")
+
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
+
+ng_module(
+    name = "selection-area",
+    srcs = glob(
+        include = ["**/*.ts"],
+        exclude = [
+            "**/*.po.ts",
+            "**/*.e2e.ts",
+        ],
+    ),
+    angular_assets = [
+        "range/range.html",
+        "timestamp/timestamp.html",
+        "selection-area.html",
+    ],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        "//apps/components-e2e/src/components/chart:chart-base",
+        "//apps/components-e2e/src/services",
+        "//libs/barista-components/button:compile",
+        "//libs/barista-components/chart:compile",
+        "@npm//@angular/common",
+        "@npm//@angular/core",
+        "@npm//@angular/router",
+    ],
+)

apps/components-e2e/src/components/checkbox/BUILD.bazel

@@ -0,0 +1,23 @@
+
+load("//tools/bazel_rules:index.bzl", "ng_module")
+
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
+
+ng_module(
+    name = "checkbox",
+    srcs = glob(
+        include = ["**/*.ts"],
+        exclude = [
+            "**/*.po.ts",
+            "**/*.e2e.ts",
+        ],
+    ),
+    angular_assets = ["checkbox.html"],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        "//libs/barista-components/checkbox:compile",
+        "@npm//@angular/common",
+        "@npm//@angular/core",
+        "@npm//@angular/router",
+    ],
+)

apps/components-e2e/src/components/combobox/BUILD.bazel

@@ -0,0 +1,23 @@
+
+load("//tools/bazel_rules:index.bzl", "ng_module")
+
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
+
+ng_module(
+    name = "combobox",
+    srcs = glob(
+        include = ["**/*.ts"],
+        exclude = [
+            "**/*.po.ts",
+            "**/*.e2e.ts",
+        ],
+    ),
+    angular_assets = ["combobox.html"],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        "//libs/barista-components/experimental/combobox:compile",
+        "@npm//@angular/common",
+        "@npm//@angular/core",
+        "@npm//@angular/router",
+    ],
+)

apps/components-e2e/src/components/confirmation-dialog/BUILD.bazel

@@ -0,0 +1,23 @@
+load("//tools/bazel_rules:index.bzl", "ng_module")
+
+package(default_visibility = ["//apps/components-e2e:__subpackages__"])
+
+ng_module(
+    name = "confirmation-dialog",
+    srcs = glob(
+        include = ["**/*.ts"],
+        exclude = [
+            "**/*.po.ts",
+            "**/*.e2e.ts",
+        ],
+    ),
+    angular_assets = ["confirmation-dialog.html"],
+    tsconfig = "//apps/components-e2e:tsconfig-app",
+    deps = [
+        "//libs/barista-components/confirmation-dialog:compile",
+        "//libs/barista-components/core:compile",
+        "@npm//@angular/common",
+        "@npm//@angular/core",
+        "@npm//@angular/router",
+    ],
+)