niklasvh / html2canvas

Screenshots with JavaScript
https://html2canvas.hertzen.com/
MIT License
30.09k stars 4.75k forks source link

Support for lch css #3174

Open fbsanchez opened 1 month ago

fbsanchez commented 1 month ago

Notes:

npm tests passing npm run format makes no changes

Summary

This PR fixes/implements the following bugs/features

Our project uses css lch function to calculate background colours. in order to get screenshots of the components wich are using lch function we needed to add this functionality

Test plan (required)

Demonstrate how the issue/feature can be replicated. For most cases, simply adding an appropriate html/css template into the reftests should be sufficient. Please see other tests there for reference.

Use following styles in examples/existing_canvas.html, ensure the html2canvas works.

    <style>
        canvas {
            border: 1px solid black;
        }
        button {
            clear: both;
            display: block;
        }
        #content {
            background: lch(76.5 4.24 49.5);
            padding: 50px 10px;
        }
    </style>

before PR:

image

after PR: image

Please make sure that code adheres to the project code formatting. Running npm run format will automatically format your code correctly. done