run InAppBrowser in an Ionic + React + Capacitor environment

Issue

I'm completely new to this technology and I can't manage to run the InAppBrowser from @ionic-native/in-app-browser. I've installed the respective plugin but it seems not to be working in the actual native app. This is my code:

import { InAppBrowser, InAppBrowserOptions } from "@ionic-native/in-app-browser";

const websiteUrl: string = "https://a-working-url.com"

const options: InAppBrowserOptions = {
  zoom: 'no',
  location: 'no',
  toolbar: 'no',
  hidden: 'yes',
  hideurlbar: 'yes',
  toolbarposition: 'bottom'
}

const browser = InAppBrowser.create(websiteUrl, '_self', options)


browser?.on('loadstop').subscribe(event => {
  browser.insertCSS({ code: "body{color: red; padding: 10mm;" });
  console.log('loadstop DONE!')
});

I get the following message in the Android log:

Msg: Native: InAppBrowserOriginal is not installed or you are running on a browser. Falling back to window.open.

What am I missing?

Note: the reason why I don't use Browser from @capacitor/core is that I can't make the browser hide its navigation bar and there is no support for insertCSS which I actually need.

Solution

ok the issue is fixed. I noticed that the plugin wasn't installed properly.. I had to reinstall the plugin by:

npm install cordova-plugin-inappbrowser

Answered By - Osman