feat: 🎸 Google Analytics 4 implementation

seznam · Nov 29, 2022 · 092ef19 · 092ef19
2 parents 25ee33a + 6ba7150
commit 092ef19
Show file tree

Hide file tree

Showing 5 changed files with 336 additions and 58 deletions.
diff --git a/packages/babel-plugin-ima-logger/src/__tests__/__snapshots__/mainSpec.js.snap b/packages/babel-plugin-ima-logger/src/__tests__/__snapshots__/mainSpec.js.snap
@@ -371,10 +371,9 @@ bar();"
 
 exports[`main getPluginObject() should replace (0, _imaPluginLogger.debugIf)() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -386,10 +385,9 @@ bar();"
 
 exports[`main getPluginObject() should replace (0, _imaPluginLogger.errorIf)() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -401,10 +399,9 @@ bar();"
 
 exports[`main getPluginObject() should replace (0, _imaPluginLogger.infoIf)() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -416,21 +413,18 @@ bar();"
 
 exports[`main getPluginObject() should replace (0, _imaPluginLogger.logIf)() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
 exports[`main getPluginObject() should replace (0, _imaPluginLogger.rejectIf)() with 0 inside if 1`] = `
 "function returingPromise() {
   let rejected;
-
   if (rejected = 0) {
     return rejected;
   }
-
   return asyncBar();
 }"
 `;
@@ -443,10 +437,9 @@ bar();"
 
 exports[`main getPluginObject() should replace (0, _imaPluginLogger.warnIf)() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -458,10 +451,9 @@ bar();"
 
 exports[`main getPluginObject() should replace (0, _pluginLogger.debugIf)() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -473,10 +465,9 @@ bar();"
 
 exports[`main getPluginObject() should replace (0, _pluginLogger.errorIf)() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -488,10 +479,9 @@ bar();"
 
 exports[`main getPluginObject() should replace (0, _pluginLogger.infoIf)() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -503,10 +493,9 @@ bar();"
 
 exports[`main getPluginObject() should replace (0, _pluginLogger.logIf)() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -518,10 +507,9 @@ bar();"
 
 exports[`main getPluginObject() should replace (0, _pluginLogger.warnIf)() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -533,10 +521,9 @@ bar();"
 
 exports[`main getPluginObject() should replace debugIf() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -548,10 +535,9 @@ bar();"
 
 exports[`main getPluginObject() should replace errorIf() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -563,10 +549,9 @@ bar();"
 
 exports[`main getPluginObject() should replace infoIf() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
@@ -578,21 +563,18 @@ bar();"
 
 exports[`main getPluginObject() should replace logIf() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
 
 exports[`main getPluginObject() should replace rejectIf() with 0 inside if 1`] = `
 "function returingPromise() {
   let rejected;
-
   if (rejected = 0) {
     return rejected;
   }
-
   return asyncBar();
 }"
 `;
@@ -605,9 +587,8 @@ bar();"
 
 exports[`main getPluginObject() should replace warnIf() with 0 inside if 1`] = `
 "foo();
-
-if (0) {// do something
+if (0) {
+  // do something
 }
-
 bar();"
 `;
diff --git a/packages/plugin-analytic-google/README.md b/packages/plugin-analytic-google/README.md
@@ -1,13 +1,14 @@
 # @ima/plugin-analytic-google
 
-This is the google analytic plugin for the IMA.js application. You can visit our site <https://imajs.io>.
+This is the Google analytic plugin for the IMA.js application. You can visit our site <https://imajs.io>.
 
-## Installation
+The plugin currently implements both UA and GA4 analytics.
+It is planned to remove UA later in year 2023 as its support ends in this year.
 
-```javascript
+## Installation
 
+```console
 npm install @ima/plugin-analytic-google @ima/plugin-script-loader --save
-
 ```
 
 ```javascript
@@ -29,7 +30,6 @@ ns.ima.plugin.analytic.google.defaultDependencies;
 
 import { GoogleAnalytic, defaultDependencies } from '@ima/plugin-analytic-google';
 */
-
 ```
 
 ```javascript
@@ -41,9 +41,12 @@ prod: {
 	$Page:{ ... },
 	plugin : {
 		analytic: {
-			google: {
-				service: 'UA-XXXXXXX-X'
-			}
+            google: { //for UA
+                service: 'UA-XXXXXXX-X'
+            },
+            google4: { //for GA4
+                service: 'G-XXXXXXXXXX'
+            }
 		}
 	}
 }
@@ -57,12 +60,14 @@ import { RouterEvents } from '@ima/core';
 var $window = oc.get('$Window');
 var $dispatcher = oc.get('$Dispatcher');
 var googleAnalytic = oc.get(GoogleAnalytic);
+var googleAnalytics4 = oc.get(GoogleAnalytics4);
 
 
 if ($window.isClient()) {
 
 	// insert analytic script to page and initialization analytic
 	googleAnalytic.init();
+	googleAnalytics4.init();
 
 	//set hit page view to analytic
 	$dispatcher.listen(RouterEvents.AFTER_HANDLE_ROUTE, (pageData) => {
@@ -73,6 +78,7 @@ if ($window.isClient()) {
 				pageData.response.status < 300)) {
 
 			googleAnalytic.hitPageView(pageData);
+            googleAnalytics4.hitPageView(pageData);
 
 		} else {
 
@@ -102,12 +108,13 @@ if ($window.isClient()) {
 	// insert analytic script to page and initialization analytic
 	googleAnalytic.init();
 	googleAnalytic.load();
+	googleAnalytics4.load();
 
 	// ...
 ```
 
 ## Dependencies
 If you are looking more details, you should
 follow this links:
-[https://github.com/seznam/IMA.js-plugins/tree/master/packages/plugin-analytic](https://github.com/seznam/IMA.js-plugins/tree/master/packages/plugin-analytic,
+[https://github.com/seznam/IMA.js-plugins/tree/master/packages/plugin-analytic](https://github.com/seznam/IMA.js-plugins/tree/master/packages/plugin-analytic),
 [https://github.com/seznam/IMA.js-plugins/tree/master/packages/plugin-script-loader](https://github.com/seznam/IMA.js-plugins/tree/master/packages/plugin-script-loader)