Fix Vitest DOM matchers and TypeScript configuration for demo tests

Co-authored-by: k3nsei <[email protected]>

Author: Copilot

projects/demo/src/app/app.component.spec.ts

@@ -38,6 +38,6 @@ describe('AppComponent', () => {
     const actual = spectator.query('header h1');
     const expected = 'ng-in-viewport demo';
 
-    expect(actual).toHaveText(expected);
+    expect(actual?.textContent?.trim()).toBe(expected);
   });
 });

projects/demo/src/app/example/example.component.spec.ts

@@ -49,7 +49,7 @@ describe('ExampleComponent', () => {
       component.handleAction({ target: el, visible: false } as InViewportAction);
       spectator.detectChanges();
 
-      expect(el).not.toHaveClass(activeClassName);
+      expect(el?.classList.contains(activeClassName)).toBe(false);
     });
 
     it('should be active item', () => {
@@ -58,7 +58,7 @@ describe('ExampleComponent', () => {
       component.handleAction({ target: el, visible: true } as InViewportAction);
       spectator.detectChanges();
 
-      expect(el).toHaveClass(activeClassName);
+      expect(el?.classList.contains(activeClassName)).toBe(true);
     });
   });
 
@@ -76,7 +76,7 @@ describe('ExampleComponent', () => {
       component.handleAction({ target: el, visible: false } as InViewportAction);
       spectator.detectChanges();
 
-      expect(el).not.toHaveClass(activeClassName);
+      expect(el?.classList.contains(activeClassName)).toBe(false);
     });
 
     it('should be active item', () => {
@@ -85,7 +85,7 @@ describe('ExampleComponent', () => {
       component.handleAction({ target: el, visible: true } as InViewportAction);
       spectator.detectChanges();
 
-      expect(el).toHaveClass(activeClassName);
+      expect(el?.classList.contains(activeClassName)).toBe(true);
     });
   });
 });