A `$` (dollar symbol) is being appended at the bottom of every page #10321

Jiralite · 2024-12-10T19:15:28Z

Jiralite
Dec 10, 2024

When I turn on Cloudflare Web Analytics, Cloudflare injects a script which I suppose the following function is not expecting, because when it executes, a $ is appended to my body on every page:

function $RC(a, b) {
    a = document.getElementById(a);
    b = document.getElementById(b);
    b.parentNode.removeChild(b);
    if (a) {
        a = a.previousSibling;
        var f = a.parentNode
            , c = a.nextSibling
            , e = 0;
        do {
            if (c && 8 === c.nodeType) {
                var d = c.data;
                if ("/$" === d)
                    if (0 === e)
                        break;
                    else
                        e--;
                else
                    "$" !== d && "$?" !== d && "$!" !== d || e++
            }
            d = c.nextSibling;
            f.removeChild(c);
            c = d
        } while (c);
        for (; b.firstChild; )
            f.insertBefore(b.firstChild, c);
        a.data = "$";
        a._reactRetry && a._reactRetry()
    }
}
;$RC("B:0", "S:0")

Here's a reference to the start of the page load:

Cloudflare's script is injected above the <template>. This has the id B:0, which means this is what $RC() will immediately look for (see its first argument).

Whilst this function is being executed, it eventually reaches the final for(; b.firstChild; ) loop. a is some text ("\n"), and the rest do not matter because a does not change. Once the loop breaks, it goes into a. a is just some text whose parent element is <body>. Now, it just does a.data = "$" and a dollar symbol is now at the bottom of the body on every page.

The issue here is that a for some reason is just some text. It seems a should instead be a comment node, as it looks like some hydration comment shenanigans are taking place.

Using the following dependencies:

@remix-run/node: ^2.15.0
@remix-run/react: ^2.15.0
@remix-run/serve: ^2.15.0
react ^18.2.0
react-dom ^18.20

Needless to say, this will not occur during development. This problem is alleviated with Web Analytics turned off, but I'd rather have it on. So, whose issue is this? React's? Remix's? Not sure where to go from here.

Hazqeel09 · 2024-12-20T03:43:46Z

Hazqeel09
Dec 20, 2024

facing the same issue, do you got any workaround for this or still the same?

1 reply

Jiralite Dec 20, 2024
Author

I have found no workaround, sadly. I still also do not know who this should be reported to.

bkyerv · 2024-12-26T07:49:38Z

bkyerv
Dec 26, 2024

what is interesting is that it appears when the app is deployed on the vps. locally I don't see that $ sign rendered. I ensured that the env is production both locally and on the vps and yes locally I don't see it rendered

0 replies

Hazqeel09 · 2024-12-26T07:55:18Z

Hazqeel09
Dec 26, 2024

may i know the cpu architecture for the vps that you guys are using? i am using arm but it didnt happen when i am deploying on my another vps using x86 architecture

0 replies

bkyerv · 2024-12-26T08:11:23Z

bkyerv
Dec 26, 2024

~# uname -m
x86_64

I am also using cloudflare for domain set up so as OP said this most likely have to do with cloudflare doing something because locally I don't see that $ sign. mind that the app is dockerized

1 reply

Hazqeel09 Dec 26, 2024

my both setup is quite similar, both is dockerized but my x86 didnt experience this but yuor answer rule out the cpu architecture

Hazqeel09 · 2024-12-26T08:21:22Z

Hazqeel09
Dec 26, 2024

this is my current workaround, changed defer from cloudflare script to async, it work and i still got the web analytics eventho it does not show the web analytics are on inside the cloudflare

https://github.com/Hazqeel09/getdoav3/blob/main/remix/app/root.tsx

2 replies

bkyerv Dec 26, 2024

I see. thank you. in the code you shared there is a token - is it safe? did you mean to put that out there?

adnanjaw Jan 2, 2025

Is that a realistic fix? I think Cloudflare should inject the script itself.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

A `$` (dollar symbol) is being appended at the bottom of every page #10321

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 5 comments 4 replies

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

Select a reply

A $ (dollar symbol) is being appended at the bottom of every page #10321

Replies: 5 comments · 4 replies

Jiralite Dec 20, 2024 Author

A `$` (dollar symbol) is being appended at the bottom of every page #10321

Replies: 5 comments 4 replies

Jiralite Dec 20, 2024
Author