Some combination of special characters in index.html break the server with Internal Server Error 500 - Unexpected identifier

burgil commented 2 months ago

Prerequisites

[X] I have written a descriptive issue title
[X] I have searched existing issues to ensure the bug has not already been reported

Fastify version

4.24.3

Plugin version

No response

Node.js version

20.16.0

Operating system

Windows

Operating system version (i.e. 20.04, 11.3, 10)

10

Description

Adding this console log to the index.html break the server with:

{"statusCode":500,"error":"Internal Server Error","message":"Unexpected identifier 'c'"}

    <script>
        console.log(`%c Example 1 + 1 = ${1 + 1}`, 'color: blue;');
    </script>

Reproduction steps can be found on the commits here: https://github.com/burgil/react-vanilla-spa

Link to code that reproduces the bug

https://github.com/burgil/react-vanilla-spa

Expected Behavior

Combination of special characters won't break the server

burgil commented 2 months ago

This issue also happens on Linux so it's not os related, also tested on node v22 The issue seems to be coming from a file named html.js inside a project named @fastify where const compiledTemplatingFunction is defined.

Adding

.replace(/`/g, '\\`').replace(/$/g, '\\$')

after the return frag inside the function serialize partially fixed the problem but still other combination of console logs break the code, making us unable to migrate our larger code base into fastify

other examples:

        console.log(`%c Example 1 + 1 = ${1 + 1}`, 'color: blue;');

        console.log('${');

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <script>
            const serverMSG = {
                old_file_path: "asd",
                new_file_path: "zxc"
            }
            const testCode = `console.log(\'%c[test]%c Handling file rename:\', \'color: #a259ff; font-weight: bold;\', \'color: #ff6347;\', \`\${serverMSG.old_file_path} -> \${serverMSG.new_file_path}\`);`;
        </script>
    </body>
</html>

And others might also exist, we only find those out by trying to run our project in there and then removing line by line everything until we find what breaks it

galvez commented 2 months ago

This seems to be a bug with the default createHtmlTemplatingFunction definition.

Provide your own for the time being.

galvez commented 2 months ago

These should be revamped in the next major release.

burgil commented 2 months ago

Looking forward! Thank you for this awesome project

galvez commented 1 month ago

Fixed in the latest release!

fastify / fastify-vite