angular-electron WebView not loading all functionalities of website

Viewed 464

I am trying to use WebView in my desktop application(which is built by Election with Angular). When I load the window, I am able to render the WebView but after login into the website's WebView content, all the other remaining functionalities are not working.

Note: Website is developed using thymeleaf.

I tried like below:

<webview id="mainwebview" nodeintegration='on' src="https://tarc-uat.gfcp.io/"
  style=" width:100%; height:calc(100vh - 11vw)"  partition="persist:sitesession" disablewebsecurity="on" webpreferences="allowRunningInsecureContent" >
  <div class="indicator"> </div>
</webview>

and Script :

onload = () => {
    const webv = document.getElementById('mainwebview')
    window.addEventListener('load', () => {
      webv.addEventListener('dom-ready', () => {
      });
    })
  }
1 Answers

after all lovable struggles i found the solution , that's working fine for me and all functionalities are working fine in website. Below is the solution

<webview id="mainwebview" attr.src="{{url}}" style=" width:100%; height:calc(100vh - 11vw)"> </webview>

and then load your url from angular component like below

  export class WebviewComponent implements OnInit {
  public url = 'https://tarc-uat.gfcp.io/';
  constructor() { }
  ngOnInit() {

  }
}

NOTE: Before that you need to import 'NO_ERRORS_SCHEMA' in angular app.module to support webview element and import at @NgModule schemas like below

import { NgModule, ErrorHandler,NO_ERRORS_SCHEMA } from '@angular/core';

 schemas: [
      CUSTOM_ELEMENTS_SCHEMA,
      NO_ERRORS_SCHEMA
    ]

That's it and there is no need of onload script if you follow this.

Related