JSDOM

Ask the community
,
1

Hello, I’m trying to get jsdom working to get a value from a fetched web page.

// Filename: backend/counterModule.jsw 
import  { fetch }  **from**  'wix-fetch' ; 
import  { jsdom }  **from**  'jsdom' ; 
**const**  { JSDOM } = jsdom; 

export function  pet_counter() { 
    fetch( "some url" , {  "method" :  "get"  }) 
        .then( **function**  (response) { 
 **if**  (response.ok) { 
 **let**  t = response.text(); 
 **return**  t; 
            }  **else**  { 
 **return**  Promise.reject( "Fetch did not succeed" ); 
            } 
        }) 
        .then( **function**  (txt) { 
 **const**  dom =  **new**  JSDOM(txt); 
 **const**  script = dom.window.document.querySelector( 'script' ); 
 **const**  objJSON = script.textContent.match(/window.changeTargetingData = ([^]+);/)[ 1 ]; 
 **const**  obj = JSON.parse(objJSON); 
 **const**  rep = obj.petition.signatureCount.total; 
            console.log(rep); 
 **return**  (rep); 
        }) 
        . **catch** ( **function**  (err) { 
 **return**  ( 'Failed to fetch page: ' , err); 
        }); 
}

But even the basic JSDOM example doesn’t work :

import  { jsdom }  **from**  'jsdom' ; 
**const**  { JSDOM } = jsdom; 
const domm = new JSDOM(`<!DOCTYPE html><p>Hello world</p>`); 
console.log(domm.window.document.querySelector("p").textContent); // "Hello world"

I get :

Error loading web module backend/counterModule.jsw: Cannot destructure property `JSDOM` of 'undefined' or 'null'.

I am confused…

2

OK, there is an error in the doc…
It’s :

**import**  { JSDOM }  **from**  'jsdom' ; 
const dom = new JSDOM(...string...);
3

The DOM cannot be accessed. Accessing document elements such as div, span, button, etc is off-limits. The way to access elements on the page is only through $w.

4

Actually I did it through JSDOM (working from the backend)

import { JSDOM } from ‘jsdom’ ;
// new instance of JSDOM from the html text
const dom = new JSDOM(txt);
// select the text between the first script tag
const script = dom.window.document.querySelector( ‘script’ );