mirror of
https://github.com/facebook/docusaurus.git
synced 2025-06-06 04:42:40 +02:00
fix(gtag): send the newly rendered page's title instead of the old one's (#7424)
Co-authored-by: Joshua Chen <sidachen2003@gmail.com> Co-authored-by: sebastienlorber <lorber.sebastien@gmail.com>
This commit is contained in:
parent
7ab97d4726
commit
49ecd8f472
2 changed files with 27 additions and 14 deletions
|
@ -15,16 +15,23 @@ const {trackingID} = globalData['docusaurus-plugin-google-gtag']!
|
|||
const clientModule: ClientModule = {
|
||||
onRouteDidUpdate({location, previousLocation}) {
|
||||
if (previousLocation && location.pathname !== previousLocation.pathname) {
|
||||
// Always refer to the variable on window in case it gets overridden
|
||||
// elsewhere.
|
||||
window.gtag('config', trackingID, {
|
||||
page_path: location.pathname,
|
||||
page_title: document.title,
|
||||
});
|
||||
window.gtag('event', 'page_view', {
|
||||
page_title: document.title,
|
||||
page_location: window.location.href,
|
||||
page_path: location.pathname,
|
||||
// Normally, the document title is updated in the next tick due to how
|
||||
// `react-helmet-async` updates it. We want to send the current document's
|
||||
// title to gtag instead of the old one's, so we use `setTimeout` to defer
|
||||
// execution to the next tick.
|
||||
// See: https://github.com/facebook/docusaurus/issues/7420
|
||||
setTimeout(() => {
|
||||
// Always refer to the variable on window in case it gets overridden
|
||||
// elsewhere.
|
||||
window.gtag('config', trackingID, {
|
||||
page_path: location.pathname,
|
||||
page_title: document.title,
|
||||
});
|
||||
window.gtag('event', 'page_view', {
|
||||
page_title: document.title,
|
||||
page_location: window.location.href,
|
||||
page_path: location.pathname,
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
|
|
|
@ -13,10 +13,16 @@ function logPage(
|
|||
location: Location,
|
||||
previousLocation: Location | null,
|
||||
): void {
|
||||
console.log(`${event}
|
||||
Previous location: ${previousLocation?.pathname}
|
||||
Current location: ${location.pathname}
|
||||
Current heading: ${document.getElementsByTagName('h1')[0]?.innerText}`);
|
||||
console.log(event, location.pathname, {
|
||||
location,
|
||||
prevLocation: previousLocation,
|
||||
heading: document.getElementsByTagName('h1')[0]?.innerText,
|
||||
title: document.title,
|
||||
description: (
|
||||
document.querySelector('meta[name="description"]') as HTMLMetaElement
|
||||
)?.content,
|
||||
htmlClassName: document.getElementsByTagName('html')[0]?.className,
|
||||
});
|
||||
}
|
||||
|
||||
export function onRouteUpdate({
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue