Access HTML elements through script

Question

I am trying to make a electron program that could log the text of a TextArea in a HTML file but for some reason I get this error:

(node:8664) UnhandledPromiseRejectionWarning: TypeError: mainWindowHTML.getTextAreaText is not a function at Object.module.exports.Save (C:\Users\user\Documents\JavaScript\node.js\Electron\INTERFACE_EDITOR\menuScripts.js:12:33) at click (C:\Users\user\Documents\JavaScript\node.js\Electron\INTERFACE_EDITOR\index.js:36:37) at MenuItem.click (C:\Users\user\Documents\JavaScript\node.js\Electron\INTERFACE_EDITOR\node_modules\electron\dist\resources\electron.asar\browser\api\menu-item.js:55:9) at Function.executeCommand (C:\Users\user\Documents\JavaScript\node.js\Electron\INTERFACE_EDITOR\node_modules\electron\dist\resources\electron.asar\browser\api\menu.js:30:13) (node:8664) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1) (node:8664) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

In my main class I basically load the HTML file into a browser window which works and when a menuitem is clicked it calls this part of my menuScripts.js script:

const url = require('url');
const path = require('path');

module.exports.Save = async(dialog) => {

const mainWindowHTML = url.format({
    pathname: path.join(__dirname , "./htmls/MainWindow.html"),
    protocol: "file",
    slashes: true
    });

const text = mainWindowHTML.getTextAreaText();
    console.log(text);
}

module.exports.New = async(dialog) => {

}

module.exports.Exit = async(window) => {
    window.close();
}

And this is my MainWindow.html file:

<html lang="en">
<head>
    <title>document</title>
</head>
<body>
    <textarea id="code" cols="30" rows="10"></textarea>
</body>
<script>
    module.exports.getTextAreaText = async() => {
        return (document.getElementById("code").innerText)
    }
</script>
</html>

`mainWindowHTML` is the result of calling [`url.format`](https://www.npmjs.com/package/url#urlformaturlobj) (`const mainWindowHTML = url.format...`), which returns a **string**. Strings don't have a method called `getTextAreaText`. — T.J. Crowder, Dec 17 '18 at 17:55

Jesper · Answer 1 · 2018-12-17T18:39:23.743

0

Can't you just do:

<html lang="en">
<head>
    <title>document</title>
</head>
<body>
    <textarea id="code" cols="30" rows="10"></textarea>
    <script src="menuScripts.js"></script>
</body>
</html>

and in menuScripts.js:

const url = require('url');
const path = require('path');

module.exports.Save = async(dialog) => {

const mainWindowHTML = url.format({
    pathname: path.join(__dirname , "./htmls/MainWindow.html"),
    protocol: "file",
    slashes: true
    });

const text = document.getElementById("code").innerText;
    console.log(text);
}

module.exports.New = async(dialog) => {

}

module.exports.Exit = async(window) => {
    window.close();
}

edited Dec 17 '18 at 18:39

answered Dec 17 '18 at 18:06

Jesper

1,819
3
12
40

The problem is that I am getting a document is not defined error – Tal Moshel Dec 17 '18 at 18:13
Okay, well then the problem is as mentioned in the comments. `url.format` just creates a string, not importing the content. – Jesper Dec 17 '18 at 18:17
Maybe use something like this https://stackoverflow.com/a/4819129/7296909 – Jesper Dec 17 '18 at 18:20
so how do I import the content? – Tal Moshel Dec 17 '18 at 18:20
I don't get why you would want to import html to javascript? You could just get the elements innertext by including the script in the html and use document.getElementById to get the element content – Jesper Dec 17 '18 at 18:22

score 0 · Answer 2 · answered Dec 18 '18 at 14:43

0

Okay, well I solved the problem using ipcRenderer instead of exporting functions which didn't really work. I really appreciate the people who tried helping!

answered Dec 18 '18 at 14:43

Tal Moshel

160
1
12

Access HTML elements through script

2 Answers2