[adblocker-electron] A form element with <input name="id" /> throws "An object could not be cloned" error

[jayakrishnankp]

Short Description

If a form contains an input element with name='id', adblocker-content/adblocker.ts throws a An object could not be cloned error.

More Context

• I was trying to open this link https://www.thetoyshop.com/shop-by-age/6-year-olds/Mouse-Trap-Game/p/532476?queryId=204f7ae81453d250c1b3daac1f2f2281 in a BrowserView in my electron app with this adblocker enabled.

• The adblocker throws an error: An object could not be cloned when we open the above link. Debugging the error it was found that the ipcRenderer in api/ipc-renderer.ts was trying to send an object which had an input element in the ids array.

• Traced the call stack of ipcRenderer.send and this element is coming from the Meta's pixel tracking form which is a form element that contains an input with name=id.

• When a form contains an input with name='id', the ids array generator in the extractFeaturesFromDOM method gets the input element instead of the form element's id because formElement.id will return the input element with name='id' https://github.com/ghostery/adblocker/blob/1f498554d45cf6a1c0b5d846b14a34fb6b327f77/packages/adblocker-content/adblocker.ts#L89-L92

• This causes the constructed ids array to have an input element which cannot be passed to structuredClone as it will throw.

Proposed Solution

Replace element.id (in api/ipc-renderer.ts/line:89) with element.getAttribute('id')

[remusao]

Hi @jayakrishnankp,

Thanks for taking the time to open this issue. This definitely looks like a bug and the approach you suggest seems reasonable. Would you be willing to open a PR with the change? I'd be happy to review and publish it.

Best,