Error invoking remote method ‘GUEST_VIEW_MANAGER_CALL’: Error: ERR_ABORTED (-3) loading ‘https://www.google.com/’ in WebView in Electron

I am using webview in my electron 18.2.3 application for opening websites in application itself.

Everything works fine but sometime clicking a link in website in webview I am getting error

Error invoking remote method 'GUEST_VIEW_MANAGER_CALL': Error: ERR_ABORTED (-3) loading 'https://www.google.com/'

Call Stack
 undefined
  com/':undefined:undefined

This is my application

import React from 'react';
import { MemoryRouter as Router, Routes, Route } from 'react-router-dom';
import icon from '../../assets/icon.svg';
import './App.css';

type Props = {

}

type State = {
  url: any,
  key: string
}
class Hello extends React.Component<Props, State> {
  webview: any;
  constructor(props) {
    super(props);
    this.state = {
      url: {
        blank: 'about:blank',
        youtube: 'https://www.youtube.com/',
        google: 'https://www.google.com/',
        wikipedia: 'https://en.wikipedia.org/wiki/Main_Page',
        w3schools: 'https://www.w3schools.com/'
      },
      key: 'blank'
    };
    this.webview = React.createRef()
  }

  componentDidMount() {
    let webview = this.webview.current
    webview.addEventListener('did-start-navigation', (event: any) => {
      console.log('event:', event)
      let newUrl = event.url
      if (newUrl != 'about:blank' && event.isInPlace && event.isMainFrame) {
        let url = { ...this.state.url }
        url[this.state.key] = newUrl
        this.setState({ ...this.state, url })
      }
    })
  }

  selectUrl(key: string) {
    this.setState({ ...this.state, key: key })
  }

  handleBack = () => {
    this.webview.current.goBack()
  }

  handleForward = () => {
    this.webview.current.goForward()
  }

  render() {
    return (
      <>
        <span onClick={this.handleBack.bind(this)}>Back</span>
        <span style={{margin: '1rem'}}></span>
        <span >Forward</span>
        <div style={{ width: '640px', height: '360px', border: 'solid' }}>
          <webview
            ref={this.webview}
            src={ this.state.url[this.state.key]}
            id="myWebview"
            style={{ display: 'inline-flex', width: '640px', height: '360px' }}
            allowpopups="true"
          />
        </div>
        <div style={{ border: 'solid' }}>
          <span onClick={() => this.selectUrl('youtube')} style={{ border: 'solid' }}>YouTube</span>
          <span onClick={() => this.selectUrl('google')} style={{ border: 'solid' }}>Google</span>
          <span onClick={() => this.selectUrl('wikipedia')} style={{ border: 'solid' }}>wikipedia</span>
          <span onClick={() => this.selectUrl('w3schools')} style={{ border: 'solid' }}>w3schools</span>
        </div>
      </>
    );
  }
}

export default function App() {
  return (
    <Router>
      <Routes>
        <Route path="/" element={<Hello />} />
      </Routes>
    </Router>
  );
}

What can be the reason of getting this error and how can I fix this?