Puppetter – Read the value of CDPJSHandle {}

I am just trying to scrap something from a website.

I am running into a problem when trying to access the value of a property that is on an element. The value returns CDPJSHandle {} instead of the object that I expect.

    const element = await page.$('canvas');
    const properties = await element.getProperties();
    const [firstKey]  = await properties.keys();
    const propertyValue = await element.getProperty(firstKey);

    console.log({
      element,        // CDPElementHandle { handle: CDPJSHandle {} },
      properties,     // Map(1) { 'jQuery3700346878389459100542' => CDPJSHandle {} },
      firstKey,       // 'jQuery3700346878389459100542',
      propertyValue,  // CDPJSHandle {}
    });

This jQuery3700346878389459100542 is a custom property attached to this html element. I can access the property via the browser with document.querySelector('canvas').jQuery370058052487285485872; which returns the object that I expect.

I know that a similar question has been asked here, which will work if I’m referencing a native HTML element property. However my scenario differs as I’m looking for a custom property.

const evaluatedValue = await element?.evaluate((el, firstKey) => el[firstKey], firstKey);
const evaluatedTextValue = await element.evaluate(el => el.id);

console.log({
  evaluatedValue, // undefined
  evaluatedTextValue, // 'n                        '
});

How can I access this property correctly?