Capacitor/core Browser plugin acts different when built for production

I am working on an app that primarily focuses on consolidating and making the navigation of a number of website much smoother and quicker. I have use the side menu and with each item in the menu is a page that makes a call to load a different web page. Example of TS file below. I am importing Plugins from @capacitor/core and using the browser plugin.
I run
ng build --prod
ionic cap sync android
ionic cap open android.

From here if i run the code, the debug apk will run as expected on the simulator or on a number of devices. When a user clicks on one of the links to a website, chrome will open it up in the app (think gmail is a good example of this similar action).
After building a production apk, this functionality is lost and a new window opens up chrome itself. Has anyone came across this and know why it would change between the debug and building a prod app for the playstore?

import { Component, OnInit } from '@angular/core';
import { Plugins } from '@capacitor/core';

const { Browser } = Plugins;

  selector: 'app-search',
  templateUrl: './',
  styleUrls: ['./'],
export class SearchPage implements OnInit {

  constructor() {
    Browser.addListener('browserPageLoaded', () => {
      console.log('browserPageLoaded event called');
    Browser.addListener('browserFinished', () => {
      console.log('browserFinished event called');
      urls: [

  async openGoogle() {
    await{ toolbarColor: '#41b883', url: '' });
  async openYahoo() {
    await{ toolbarColor: '#41b883', url: '' });
  ngOnInit() {