All geek questions in one place

How to return a value from a simple jsdom function?

I am using jsdom with jquery and it works fine. However, I try to modify my code a bit, so I don’t repeat it myself, so I made the main function from some jsdom code that accepts some html (DOM), improves it with jquery and spits it back, However, I cannot return my result and thus assign it to the var call. I probably won’t return to the right place, but I just don’t see the obvious, if so. May help a bit.

Here is the code:

function tweakIt(html_in){ var jsdom = require('jsdom'); jsdom.env({ html: html_in, scripts: [ '../public/javascripts/jquery-1.7.1.min.js', ], done: function(errors, window) { var $ = window.$; // do some jquery magic and manipulate the dom $('body').append('<div>foo</div>'); console.log('Freshly Manipulated HTML: '+ $('body').html()); // it logs perfectly return $('body').html(); // this isn't returned to where I called tweakIt() from, why not? } }); } var oldhtml = '<html><body><div>some text</div></body></html>'; var newhtml = tweakIt(oldhtml); // never gets set because nothing gets returned, why?

EDIT:

This was an async problem, so here's how to do it using a callback instead of returning:

 function tweakIt(html_in, callback){ var jsdom = require('jsdom'); jsdom.env({ html: html_in, scripts: [ '../public/javascripts/jquery-1.7.1.min.js', ], done: function(errors, window) { var $ = window.$; // do some jquery magic and manipulate the dom $('body').append('<div>foo</div>'); console.log('Freshly Manipulated HTML: '+ $('body').html()); // it logs perfectly callback($('body').html()); // instead of a return, pass the results to the callback } }); } var oldhtml = '<html><body><div>some text</div></body></html>'; var newhtml = tweakIt(oldhtml, function(newstuff){ console.log(newstuff); // woohoo! it works! });
+4
source share
2 answers

I do not think you can do this using the return value, because done: is async. Try adding a callback to your tweakIt and get a new html by sending it as a parameter, for example.

tweakIt(oldHtml, function(newHtml) {/*use the result here*/})

+5
source

The new version of the JSDOM API no longer has a "made" callback option.

So, I wrote a “bad person callback” to access the DOM variable only after it was set.

 function getSomeDOMVar(callback) { const jsdom = require("jsdom"); const { JSDOM } = jsdom; const dom = new JSDOM(` <!DOCTYPE html> <html> <body> <script> var result; // globally scoped, undefined var, accessible in the node scope as dom.window.result function doSomething() { // your code goes here } // then assign the data you want back to your the globally scoped var result = doSomething(); </script> </body> </html> `, { runScripts: "dangerously", resources: "usable" }); // poor man callback function waitForVar() { if (typeof dom.window.result !== 'undefined') { cb(dom.window.result); } } setTimeout(waitForVar, 1000); } getSomeDOMVar(function(result) { console.log(result) });
0
source

Source: https://habr.com/ru/post/1398100/

More articles:


All Articles