[Feature Request]: Support capturing background images set via CSS (e.g., background: url(...)) in snapshots

[liziwei0108]

Preflight Checklist

• I have searched the issue tracker for a feature request that matches the one I want to file, without success.

What package is this feature request for?

rrweb

Problem Description

Currently, when generating a DOM snapshot, rrweb only supports the inline images in the tag (i.e., the inlineImages feature), but cannot capture and save background images set by CSS (such as div {background: url(...);}). This causes these background images to be lost during playback, affecting visual consistency.

Proposed Solution

It is hoped that RRWeb can expand its snapshot logic to identify and capture the following types of image resources:

• All elements with a background: url(...) style.
• Support drawing these images onto a temporary Canvas and converting them into DataURL, similar to how it currently handles elements.

Thank you so much.

Alternatives Considered

1. Expand serializeElementNode to identify elements with a background:url(...) attribute.
2. Parse the URL(...) link of these elements.
3. Download the image using fetch() or an Image object.
4. Draw the image onto a Canvas and save it as a structure similar to rr_dataURL.

Additional Information

No response