feat(challenge28): testing a simple checkbox

apps/testing-checkbox/src/app/app.component.spec.ts

@@ -0,0 +1,10 @@
+import { render } from '@testing-library/angular';
+import { AppComponent } from './app.component';
+
+describe('AppComponent', () => {
+  describe('When checking the checkbox', () => {
+    it('Then button is enabled', async () => {
+      await render(AppComponent);
+    });
+  });
+});

apps/testing-checkbox/src/app/app.component.ts

@@ -0,0 +1,27 @@
+import { Component } from '@angular/core';
+
+@Component({
+  standalone: true,
+  selector: 'app-root',
+  template: ` <label for="agree">Agreed</label>
+    <input
+      class="ml-2"
+      id="agree"
+      type="checkbox"
+      [value]="check"
+      (input)="toggleCheck()" />
+    <button
+      class="border p-2 rounded-lg ml-10"
+      [class.bg-gray-500]="!check"
+      [class.text-white]="!check"
+      [disabled]="!check">
+      Submit
+    </button>`,
+})
+export class AppComponent {
+  check = false;
+
+  toggleCheck() {
+    this.check = !this.check;
+  }
+}