RXJS from() doesn't execute within concatMap()

Question

I am trying to run a test with Jasmine to click a button which copies a value to the clipboard. I'm then trying to read the value that was saved in the clipboard.

I am not sure what I am doing wrong here, but the output that I am getting in the console is this:

timer 1

What I am expecting to see in the console is this:

timer 1
read
timer 2

The Jasmine code that I am using looks like this:

  it('should copy input value', () => {
    const click = component.clickButton('buttonElRef');
    click.subscribe(value => {
      console.log('v', value);
    });
  });

The Angular test component looks like this:

class CopyToClipboardTest {
  clickButton(which: 'buttonObjRef' | 'buttonElRef'): Observable<string> {
    this[which].nativeElement.click();
    return timer(100).pipe(
      tap(() => console.log('timer 1')),
      concatMap(() => this.getClipboard()),
      tap(() => console.log('timer 2')),
    );
  }

  getClipboard(): Observable<string> {
    return from(navigator.clipboard.readText()).pipe(tap(() => console.log('read')));
  }
}

Answer 1

So, when using the clipboard you need to give the window focus before executing clipboard events.

This fixes the issue (it doesn't seem to work on auto reload though):

beforeAll(() => window.focus());