ElisePatrikainen

####################################
# Fetch and install the NodeJS rules
http_archive(
    name = "build_bazel_rules_nodejs",
    url = "https://github.com/bazelbuild/rules_nodejs/archive/0.7.0.zip",
    strip_prefix = "rules_nodejs-0.7.0",
    sha256 = "d0cecf6b149d431ee8349f683d1db6a2a881ee81d8066a66c1b112a4b02748de",
)

load("@build_bazel_rules_nodejs//:defs.bzl", "node_repositories")

ElisePatrikainen

# Fetch and install the TypeScript rules
http_archive(
    name = "build_bazel_rules_typescript",
    url = "https://github.com/bazelbuild/rules_typescript/archive/0.12.3.zip",
    strip_prefix = "rules_typescript-0.12.3",
    sha256 = "967068c3540f59407716fbeb49949c1600dbf387faeeab3089085784dd21f60c",
)

load("@build_bazel_rules_typescript//:defs.bzl", "ts_setup_workspace")

ElisePatrikainen

  <div #element role="dialog" cdkTrapFocus>
      <label>Sample field</label>
      <input>
      <label>Focus Trap starts here</label>
      <input cdkFocusRegionStart>
      <label>Sample field</label>
      <input>
      <label>Focus Trap (should) end here</label>
      <input cdkFocusRegionEnd>
      <label>Sample field</label>

ElisePatrikainen

import { Component, ViewChild, ViewChildren, ElementRef, QueryList, HostListener, AfterViewInit } from '@angular/core';
import { FocusTrapFactory, FocusMonitor, ListKeyManager} from '@angular/cdk/a11y'

@Component({
  selector: 'app-root',
  template: `
  <button (click)="testA11y()"> Test A11y! </button>
  <div #element role="dialog" hidden=true>
      <label>Sample field</label>
      <input #elementChild>