Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Front kernsanierung phase2 user event reporter #105

Merged
merged 4 commits into from
Feb 27, 2024
Merged

Front kernsanierung phase2 user event reporter #105

merged 4 commits into from
Feb 27, 2024

Conversation

thori2t
Copy link
Collaborator

@thori2t thori2t commented Feb 21, 2024

No description provided.

ps100000
ps100000 requested changes Feb 25, 2024
View reviewed changes
Meilensteine/Meilenstein_04/frontend/test/UserEventReporter.test.js Outdated
Comment on lines 13 to 15
document.body.innerHTML = '<div id="mockContainer"></div>';
container = document.getElementById('mockContainer');
userEventReporter = new UserEventReporter(container);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Du kannst auch document.body als container verwenden

Meilensteine/Meilenstein_04/frontend/test/UserEventReporter.test.js Outdated
Comment on lines 18 to 72
test('success() creates success-Toast', async () => {
userEventReporter.success('TestNachricht');
await awaitAllAsync();
expect(container.innerHTML).toBe(
`<div class="toast-container position-fixed bottom-0 end-0 p-3" style="z-index: 11"><div class="toast align-items-center bg-success fade show showing" role="alert" aria-live="assertive" aria-atomic="true">
<div class="d-flex">
<div class="toast-body"></div>
<button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
</div></div><div id="modal-container"></div>`,
);
expect(container.getElementsByClassName('toast-body')[0].innerText).toBe('TestNachricht');
});

test('info() creates info-Toast', async () => {
userEventReporter.info('TestNachricht');
await awaitAllAsync();
expect(container.innerHTML).toBe(
`<div class="toast-container position-fixed bottom-0 end-0 p-3" style="z-index: 11"><div class="toast align-items-center bg-light fade show showing" role="alert" aria-live="assertive" aria-atomic="true">
<div class="d-flex">
<div class="toast-body"></div>
<button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
</div></div><div id="modal-container"></div>`,
);
});

test('warn() creates warn-Toast', async () => {
userEventReporter.warn('TestNachricht');
await awaitAllAsync();
expect(container.innerHTML).toBe(
`<div class="toast-container position-fixed bottom-0 end-0 p-3" style="z-index: 11"><div class="toast align-items-center bg-warning fade show showing" role="alert" aria-live="assertive" aria-atomic="true">
<div class="d-flex">
<div class="toast-body"></div>
<button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
</div></div><div id="modal-container"></div>`,
);
expect(container.getElementsByClassName('toast-body')[0].innerText).toBe('TestNachricht');
});

test('error() creates error-Toast', async () => {
userEventReporter.error('TestNachricht');
await awaitAllAsync();
expect(container.innerHTML).toBe(
`<div class="toast-container position-fixed bottom-0 end-0 p-3" style="z-index: 11"><div class="toast align-items-center bg-danger fade show showing" role="alert" aria-live="assertive" aria-atomic="true">
<div class="d-flex">
<div class="toast-body"></div>
<button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
</div></div><div id="modal-container"></div>`,
);
expect(container.getElementsByClassName('toast-body')[0].innerText).toBe('TestNachricht');
});
});
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

DRY.
Mit test.each wird das deutlich kompakter

Meilensteine/Meilenstein_04/frontend/test/UserEventReporter.test.js
expect(container.getElementsByClassName('toast-body')[0].innerText).toBe('TestNachricht');
});
});

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Mir fehlt noch min. ein Test der mal mehrere Toasts zeitgleich erzeugt. Extrapunkte gibts fürs Testen des automatischen ausblendens von info und success.

Meilensteine/Meilenstein_04/frontend/test/UserEventReporter.test.js Outdated
Comment on lines 75 to 82
document.body.innerHTML = '<div id="mockContainer"></div>';
let container = document.getElementById('mockContainer');
let userEventReporter = new UserEventReporter(container);
beforeEach(() => {
document.body.innerHTML = '<div id="mockContainer"></div>';
container = document.getElementById('mockContainer');
userEventReporter = new UserEventReporter(container);
});
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Das musst du hier nicht noch mal machen

Meilensteine/Meilenstein_04/frontend/test/UserEventReporter.test.js Outdated
Comment on lines 21 to 28
expect(container.innerHTML).toBe(
`<div class="toast-container position-fixed bottom-0 end-0 p-3" style="z-index: 11"><div class="toast align-items-center bg-success fade show showing" role="alert" aria-live="assertive" aria-atomic="true">
<div class="d-flex">
<div class="toast-body"></div>
<button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
</div></div><div id="modal-container"></div>`,
);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Bitte mach das mit Snapshots. Das ist deutlich schöner und weniger wartungsintensiv bei Änderungen. >_<

Meilensteine/Meilenstein_04/frontend/test/UserEventReporter.test.js Outdated
</div>
</div></div><div id="modal-container"></div>`,
);
expect(container.getElementsByClassName('toast-body')[0].innerText).toBe('TestNachricht');
Copy link
Collaborator

@ps100000 ps100000 Feb 25, 2024 •
edited

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

innerText wird offiziell nicht von jsdom(was wiederum von jest genutzt wird) unterstützt. Siehe jsdom/jsdom#1245. Ich denke die beste Option wäre tatsächlich unsere Implementierungen auf textContent umzuschreiben, da wir von der Verwendung von innerText keinen Vorteil haben und damit unsere Tests nicht solche zusätzlichen Workarounds enthalten müssen.
Zum Vergleich von innerText und textContent: https://kellegous.com/j/2013/02/27/innertext-vs-textcontent/

@sonarcloud SonarCloud
Copy link

sonarcloud bot commented Feb 27, 2024

Quality Gate Failed Quality Gate failed

Failed conditions
16.7% Coverage on New Code (required ≥ 80%)

See analysis details on SonarCloud

@ps100000 ps100000 merged commit eea290f into Front_Kernsanierung_Phase2 Feb 27, 2024
1 of 2 checks passed
@ps100000 ps100000 deleted the Front_Kernsanierung_Phase2_UserEventReporter branch February 27, 2024 18:07
NociCreep added a commit that referenced this pull request Feb 28, 2024
@NociCreep
Squashed commit of the following:
600fd10 
commit eea290f
Merge: ed568da 4d9c5d9
Author: De_Coder <de_coder@posteo.de>
Date:   Tue Feb 27 19:07:31 2024 +0100

    Merge pull request #105 from schmidti2002/Front_Kernsanierung_Phase2_UserEventReporter

    Front kernsanierung phase2 user event reporter

commit 4d9c5d9
Author: thori2t <thoralf.teumer@web.de>
Date:   Tue Feb 27 19:04:48 2024 +0100

    Bugg fixed

commit db7d5de
Author: thori2t <thoralf.teumer@web.de>
Date:   Tue Feb 27 19:01:39 2024 +0100

    UserEvenReporter verbessert und innerText ui textContent geändert

commit ed568da
Merge: 734f67f 42c9bb8
Author: De_Coder <de_coder@posteo.de>
Date:   Tue Feb 27 18:42:29 2024 +0100

    Merge pull request #109 from schmidti2002/Front_Kernsanierung_Phase2_BubbleSortLogic

    Front kernsanierung phase2 bubble sort logic

commit 734f67f
Merge: 11fb9a2 31a0cd8
Author: De_Coder <de_coder@posteo.de>
Date:   Tue Feb 27 18:41:12 2024 +0100

    Merge pull request #108 from schmidti2002/Front_Kernsanierung_Phase2_SortVisualizerView_Test

    Front kernsanierung phase2 sort visualizer view test

commit 42c9bb8
Author: thori2t <100696688+thori2t@users.noreply.github.com>
Date:   Tue Feb 27 18:40:05 2024 +0100

    Apply suggestions from code review

    Verbesserungen

    Co-authored-by: De_Coder <de_coder@posteo.de>

commit 31a0cd8
Author: De_Coder <de.coder@gmx.de>
Date:   Tue Feb 27 18:33:37 2024 +0100

    improved tests

commit 177c3ed
Author: thori2t <thoralf.teumer@web.de>
Date:   Mon Feb 26 19:44:45 2024 +0100

    FUNKTIONIERT

commit 031901f
Author: thori2t <thoralf.teumer@web.de>
Date:   Mon Feb 26 19:31:03 2024 +0100

    await hinzugefügt

commit 987aff4
Author: thori2t <thoralf.teumer@web.de>
Date:   Mon Feb 26 15:08:18 2024 +0100

    Verbesserungen

commit e35574b
Author: thori2t <thoralf.teumer@web.de>
Date:   Sat Feb 24 12:00:57 2024 +0100

    Kommentar hinzugefügt

commit 8efbe9d
Author: thori2t <thoralf.teumer@web.de>
Date:   Fri Feb 23 22:06:11 2024 +0100

    Test hinzugefügt (funktioniert noch nicht)

commit 2684658
Author: thori2t <thoralf.teumer@web.de>
Date:   Wed Feb 21 14:16:03 2024 +0100

    Tests funktionieren jetzt

commit 189e0e4
Author: thori2t <thoralf.teumer@web.de>
Date:   Wed Feb 21 11:46:53 2024 +0100

    UserEventReporter Tests hinzugefügt

commit 603fe5b
Author: thori2t <thoralf.teumer@web.de>
Date:   Mon Feb 19 19:10:10 2024 +0100

    BubbleSort Tests wurden Erfolgreich hinzugefügt

commit fb67269
Author: thori2t <thoralf.teumer@web.de>
Date:   Mon Feb 19 17:57:12 2024 +0100

    Kleine Änderung

commit 7de0c68
Author: thori2t <thoralf.teumer@web.de>
Date:   Sun Feb 18 20:02:38 2024 +0100

    Fehler behoben, aber immer noch fehlerhaft
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@ps100000 ps100000 ps100000 approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

None yet
2 participants
@thori2t @ps100000