Screen orientation lock not working (eg. portrait-primary) if the device is locked in other orientation (eg. landscape-primary) but held in the first orientation (eg. portrait-primary)

[ghost]

Bug Report

Hello, I have an application which plays live streams. Because we want custom controls on iOS we can't use the fullscreen API from our player, so we need to mimic it by using css. When the user hits a button the app is locked to landscape and the css changes for fullscreen view. The other way around for exit fullscreen.

Problem

The screen orientation works perfect on Android, but not for iOS.

What is expected to happen?

The application should change its orientation as the call to screenOrientation.lock is made.

What does actually happen?

If the phone is HELD in the same orientation everything works as expected, even on iOS.

But if the following steps are done:

• the phone is held in portrait (locked)
• user hits fullscreen => app locks to landscape and everything looks good
• the user turns the phone to landscape then back to portrait (the app is still in landscape, being locked)
• the user hits the exit fullscreen button which should lock the phone to portrait => the phone remains in landscape (100% of the cases). Here is the even stranger part, if the user turns the phone in any landscape mode the app goes in portrait and it is locked there. It seems that somehow the phone realizes it is not in portrait only after the user rotates the phone and then it changes to portrait, as already mentioned.

Information

The code runs without any issues, no warnings, no errors, logs from within the lock promise are displayed, everything seems fine, the phone does not change its orientation.

Command or Code

import {ScreenOrientation} from '@ionic-native/screen-orientation/ngx';

constructor(private screenOrientation: ScreenOrientation) {
        this.orientation = this.screenOrientation.type;

        this.screenOrientation.onChange().subscribe(() => {
            if (this.orientation !== this.screenOrientation.type) {
                this.orientation = this.screenOrientation.type;
                this.orientationChangeSubject.next(this.screenOrientation.type);
            }
        });
}

private changeTo(orientation, unlock: boolean = true): Promise<void> {
        return this.screenOrientation.lock(orientation).then(() => {
            this.orientation = orientation;
            if (unlock) {
                this.unlock();
            }
        }).catch(() =>
            console.error('The fullscreen button does not work from the browser, only from mobile devices')
        );
}

// The "changeTo " method is called like this:
changeToPortraitAndLock() {
        return this.changeTo(this.screenOrientation.ORIENTATIONS.PORTRAIT_PRIMARY, false);
}

Environment, Platform, Device

iOS 14.3

Version information

"@capacitor/android": "^2.4.2",
"@capacitor/core": "^2.4.2",
"@capacitor/ios": "^2.4.2",
"@ionic-native/core": "^5.0.7",
"@ionic-native/screen-orientation": "^5.33.1",
"@ionic-native/splash-screen": "^5.0.0",
"@ionic/angular": "^5.0.0",
"@ionic/pwa-elements": "^1.5.2",
"cordova-plugin-screen-orientation": "^3.0.2",

Checklist

• [ X ] I searched for existing GitHub issues
• [ X ] I updated all Cordova tooling to most recent version
• [ X ] I included all the necessary information above

[andrehhtm]

Do you have any updates about this problem?

(sorry for reopen this thread)