angular / angular/components

bug(MatSnackBarHarness): Testing a snack bar with a duration

Open
#19,290 10 comments 2 reactions 0 assignees View on GitHub
area: material/snack-bar P3
Dominant language
TypeScript
Stars
25k
Forks
6.8k
Avg merge
1d 8h
Merged PRs (30d)
91

Description

#### Reproduction

https://stackblitz.com/edit/components-issue-v9512z?file=src%2Fapp%2Fexample-test.spec.ts

Steps to reproduce:
1. Try to e.g. `await harness.getMessage()` a snack bar that was opened with a `duration`. You can see this simply by following the link above, which will run that automatically.

#### Expected Behavior

The harness returns the message in the snack bar.

#### Actual Behavior

The test hangs for the duration that the snack bar is open, then fails with "Failed to find element".

#### Environment

- Angular: 9.1.5
- CDK/Material: 9.2.2
- Browser(s): Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Windows

#### Commentary

Using the same test code, I can test a snack bar that was opened without a duration. But if my production code _does_ use a duration it does not appear possible to test it with the harness. Am I missing something? I assume assigning a duration is a common use-case.

Contributor guide

Open the contributing guide

Research direction

Start with the linked StackBlitz reproduction, especially src/app/example-test.spec.ts, and trace MatSnackBarHarness.getMessage() when the snack bar has a duration. Compare it with a snack bar without a duration. Done means the harness retrieves the message instead of waiting for dismissal and failing with "Failed to find element".

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
testing
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.