Issue with exiting full screen on Angular when starting Chrome in full-screen mode.
HTML:
<hello name="{{ name }}"></hello>
<a href="https://angular-go-full-screen-f11-key.stackblitz.io" target="_blank" style="display: block;">
Open in new window
</a>
<button (click)="openFullscreen()">Go full screen</button>
<button (click)="closeFullscreen()">Exit full screen</button>
TypeScript:
import { DOCUMENT } from '@angular/common';
import { Component, Inject, OnInit } from '@angular/core';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit {
constructor(@Inject(DOCUMENT) private document: any) {}
elem;
ngOnInit() {
this.elem = document.documentElement;
}
openFullscreen() {
// Code for going full screen
}
closeFullscreen() {
// Code for exiting full screen
}
}
Solution sample here.
The "Go full screen" and "Exit full screen" buttons work correctly when opening the sample.
However, when opening in full-screen mode using the command below, the "Exit full screen" button does not work.
chrome.exe --start-fullscreen https://angular-go-full-screen-f11-key.stackblitz.io
Why is the "Exit full screen" functionality affected by starting in full-screen mode?
How can this issue be resolved?