loupe icon indicating copy to clipboard operation
loupe copied to clipboard

Handle circular references better

Open fregante opened this issue 1 year ago • 2 comments

It looks like https://github.com/chaijs/loupe/issues/44 isn't fully fixed.

It's hard to make a repro because I'm using loupe via Vitest, but it seems to be a problem with https://github.com/WebReflection/linkedom and some documents:

The repro should look something like:

import {parseHTML} from 'linkedom';

const request = await fetch('https://github.com/refined-github/refined-github/issues', {
	headers: {
		Accept: 'text/html',
	},
});
const html = await request.text();
const {document} = parseHTML(html);
const matches = document.querySelectorAll('a');

assert.lengthOf(matches, 100)

The assertion probably gets caught up trying to preview the DOM objects, which has plenty of circular references. I'm not sure what's wrong with the DOM generated by that particular page, but it fails there and not on other similar pages.


RangeError: Maximum call stack size exceeded
 ❯ inspectProperty node_modules/loupe/loupe.js:254:27
 ❯ inspectList node_modules/loupe/loupe.js:208:28
 ❯ inspectObject node_modules/loupe/loupe.js:575:28
 ❯ inspectClass node_modules/loupe/loupe.js:606:35
 ❯ Object.inspect node_modules/loupe/loupe.js:850:16
 ❯ inspectProperty node_modules/loupe/loupe.js:268:21
 ❯ inspectList node_modules/loupe/loupe.js:208:28
 ❯ inspectObject node_modules/loupe/loupe.js:578:26
 ❯ Object.inspect node_modules/loupe/loupe.js:838:14
 ❯ inspectProperty node_modules/loupe/loupe.js:268:21

fregante avatar Dec 17 '23 06:12 fregante