Quantcast
Channel: Active questions tagged html - Stack Overflow
Viewing all articles
Browse latest Browse all 67411

How to fix "input elements not working properly in electron webview"

$
0
0

I'm creating a WebView App for my website using "electron" and I wanted to have tabbed windows in it, I choose "electron-navigation" which was working fine, but inside the WebView my website's input elements didn't work except "select" element and some of them starts working when I "blur" the WebView i.e. I focus on other application or desktop and refocus it starts working but textarea never works …. please help me

I tried looking for the solution inside code but I couldn't find any idea, and I also googled whole night but no luck

This is Index.html

<div id="nav-body-tabs"></div>

<div id="nav-body-ctrls"></div>

<div id="nav-body-view-wrapper">
  <div id="nav-body-views"></div>
</div>

this is index.js

     const path = require('path')
        const url = require('url')
        const { ipcRenderer } = require('electron')

        document.getElementById('nav-body-views').style.position = 'absolute'
        document.getElementById('nav-body-views').style.width = '100%'
        document.getElementById('nav-body-views').style.height = '100%'

        const navDefaultURL = url.format({
          pathname: 'vclass.us/user/login',
          protocol: 'https',
          slashes: true
        })
        const enav = new (require('electron-navigation'))({
          newTabParams: [navDefaultURL]
        })
        enav.newTab(navDefaultURL, {
          id: "test",
          title: 'vClass',
          icon: 'default',
          close: true,
          readonlyUrl: true,
          contextMenu: true
        })
        enav.openDevTools("test")
        });

This is electron.js

    const { app, BrowserWindow } = require('electron');
    const url = require('url');
    const path = require('path');

    let win;

function createWindow() {
  win = new BrowserWindow({
    title: 'vClass',
    width: 960,
    height: 540,
    webPreferences: { nodeIntegration: true, webviewTag: true },
    show: false,
    center: true,
    minWidth: 640,
    minHeight: 360,
    titleBarStyle: 'hidden',
    icon: path.join(__dirname, 'assets/icons/png/64x64.png')
  });

  win.setMenuBarVisibility(false)

  win.once('ready-to-show', () => {
    win.show()
  })
  win.on('closed', () => {
    win = null
  })
  win.loadURL(`file://${__dirname}../../assets/index.html`)
}

app.on('ready', createWindow);


app.on('activate', () => {
  if (win === null) {
    createWindow()
  }
})


let link;

app.on('open-url', function (event, data) {
  event.preventDefault();
  link = data;
});

app.setAsDefaultProtocolClient('vClass');

module.exports.getLink = () => link;

`

I expect the results that the inputs should be clickable like usual on a browser

Note : Everything works fine when I directly loadURL from electron but it doesn't work in webview


Viewing all articles
Browse latest Browse all 67411

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>