Testing for GTM

[mazipan]

Description

Improvement for #419, we need to setup a proper test so we can avoid this accident in the future

[rubiagatra]

I think I'll try this

[rubiagatra]

There are 2 GTMs, we need only one right? @mazipan @resir014 , Sorry I am not yet familiar/understand with noscript

https://github.com/kawalcovid19/wargabantuwarga.com/blob/main/pages/_document.tsx#L19

https://github.com/kawalcovid19/wargabantuwarga.com/blob/main/pages/_app.tsx#L122

and the test is already there

https://github.com/kawalcovid19/wargabantuwarga.com/blob/main/lib/__tests__/gtm.test.ts

[mazipan]

But the test is calling the function directly.
I think it's better if we render some pages, and make sure we have GTM script in the page.

[rubiagatra]

Ahh, I see, how about the noscript @mazipan ? is still need in _document.tsx there?

[mazipan]

Yes, it's part of the snippet code from GTM.

Can we assert the noscript also?

[mazipan]

If this can not be addressed in Unit Testing, then we need to utilize our E2E test on Cypress to check the existence of GTM script.

[rubiagatra]

Got it, investigating right now

[zainfathoni]

Not only that, I think we should also assert that the script is actually calling the GA endpoints correctly. Recently we realized that our Content Security Policy blocked GA requests.

We can intercept the API requests using Cypress' routeHandler feature. I have been doing it for testing GA events in Ninja Van's website since a few years ago. 😁

[rubiagatra]

So I just tried to test _document.tsx, Any experience for testing that file? @zainfathoni @mazipan

tried https://stackoverflow.com/questions/67629091/how-to-test-document-in-next-using-jest

cannot use the simple render function in rtl render(<MyDocument />)