feat: new agenda

05_react/unterricht/tag45/01_react-app-with-tests/src/test/FormContact.test.jsx

@@ -88,7 +88,9 @@ describe('FormContact', () => {
       const submitButton = screen.getByRole('button', { name: 'Send Message' });
 
       const longName = 'a'.repeat(61);
-      await user.type(firstNameInput, longName);
+
+      await user.click(firstNameInput);
+      await user.paste(longName);
       await user.click(submitButton);
 
       expect(
@@ -160,7 +162,9 @@ describe('FormContact', () => {
       const submitButton = screen.getByRole('button', { name: 'Send Message' });
 
       const longName = 'b'.repeat(61);
-      await user.type(lastNameInput, longName);
+
+      await user.click(lastNameInput);
+      await user.paste(longName);
       await user.click(submitButton);
 
       expect(
@@ -312,7 +316,10 @@ describe('FormContact', () => {
       const submitButton = screen.getByRole('button', { name: 'Send Message' });
 
       const longMessage = 'a'.repeat(1001);
-      await user.type(messageInput, longMessage);
+
+      await user.click(messageInput);
+      await user.paste(longMessage);
+      // await user.type(messageInput, longMessage); //. 10001 mal rerendern von FormContact. (Performance issues)
       await user.click(submitButton);
 
       expect(

06_js-debug/agenda.md

@@ -684,3 +684,81 @@ offene Übungen.
 Projektarbeit
 
 ---
+
+## JavaScript/TypeScript Debugging & Testing
+
+--
+
+### Tag 46
+
+**Inhalt:**
+
+- inversion, extraction, DRY-Prinzip
+- Typische Fehlermeldungen: Syntaxfehler, Referenzfehler, TypeError
+- Einrichtung von TS
+- Logische Fehler
+
+**Übungen:**
+Projektarbeit
+
+---
+
+### Tag 47
+
+**Inhalt:**
+
+- Debugging-Techniken – Chrome Debugger
+- Webentwickler Developer Tools
+- Debugging-Techniken – VSCode Debugger
+
+**Übungen:**
+Projektarbeit
+Übungen 05 - 14
+
+---
+
+### Tag 48
+
+**Inhalt:**
+
+- Einführung in Vitest und Unit Testing
+- Installieren von Vitest und Schreiben unseres ersten Tests
+- Einführung in die React Testing Library
+- Unit-Tests in der React-Entwicklung verstehen
+
+**Übungen:**
+Projektarbeit
+Übungen 15 - 19
+
+---
+
+### Tag 49
+
+**Inhalt:**
+
+- Unseren ersten Unit-Test schreiben
+- Unit-Tests mit einer Komponentenliste und dem Router schreiben
+- Testen von Benutzerverhalten in Unit-Tests
+- Performance-Optimierung mit React
+- useMemo, React.Memo, useCallback, useRef
+
+**Übungen:**
+Abschluss React Class
+Projektarbeit
+
+---
+
+### Tag 50
+
+**Inhalt:**
+
+- useCallback Hook
+- React.lazy, Suspense
+- Zusammenfassen der React Komponenten
+- Wiederholung der Inhalte
+
+**Übungen:**
+Projektarbeit
+Übungen 22 - 23
+
+---