diff --git a/frontend/package.json b/frontend/package.json
index 596bfcf..b36d4b4 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -17,6 +17,7 @@
"react-dom": "^17.0.2",
"react-scripts": "4.0.3",
"react-tsparticles": "^1.28.0",
+ "react-webworker": "^2.1.0",
"tslib": "^2.2.0"
},
"scripts": {
diff --git a/frontend/public/worker.js b/frontend/public/worker.js
index ffd23fa..617e62f 100644
--- a/frontend/public/worker.js
+++ b/frontend/public/worker.js
@@ -1 +1,5 @@
-postMessage('hello');
+/* eslint-disable import/prefer-default-export */
+onmessage = (e) => {
+ console.log(e.data, navigator[e.data]);
+ postMessage(navigator[e.data]);
+};
diff --git a/frontend/src/components/Issues.js b/frontend/src/components/Issues.js
new file mode 100644
index 0000000..746f786
--- /dev/null
+++ b/frontend/src/components/Issues.js
@@ -0,0 +1,23 @@
+/* eslint-disable no-unused-vars */
+import parse from 'html-react-parser';
+import { useState, useEffect } from 'react';
+import { checkUndefinedProperties, checkWebWorker } from './navigator';
+
+const Issues = ({ item }) => {
+ const [workerData, setWorkerData] = useState();
+ useEffect(() => {
+ checkWebWorker(item, setWorkerData);
+ }, []);
+
+ return (
+
+ {parse(checkUndefinedProperties(item))}
+
+ <>{workerData}>
+ |
+ );
+
+ // return {parse(checkUndefinedProperties(item), workerData)} | ;
+};
+
+export default Issues;
diff --git a/frontend/src/components/NewTable.js b/frontend/src/components/NewTable.js
index 40644e1..cdb0608 100644
--- a/frontend/src/components/NewTable.js
+++ b/frontend/src/components/NewTable.js
@@ -1,20 +1,27 @@
+/* eslint-disable no-unused-vars */
import parse from 'html-react-parser';
+import { useState, useEffect } from 'react';
import { checkUndefinedProperties } from './navigator';
+import Issues from './Issues';
-const Table = ({ data }) => (
-
-
- {data.map((item) => (
-
-
- | {item.title} |
- {item.value} |
- {parse(checkUndefinedProperties(item))} |
-
-
- ))}
-
-
-);
+const Table = ({ data }) => {
+ const [workerData, setWorkerData] = useState();
+
+ return (
+
+
+ {data.map((item) => (
+
+
+ | {item.title} |
+ {item.value} |
+
+
+
+ ))}
+
+
+ );
+};
export default Table;
diff --git a/frontend/src/components/navigator.js b/frontend/src/components/navigator.js
index 1642798..19bb444 100644
--- a/frontend/src/components/navigator.js
+++ b/frontend/src/components/navigator.js
@@ -1,42 +1,42 @@
/* eslint-disable dot-notation */
-export { getNavigator, checkUndefinedProperties };
+export { getNavigator, checkUndefinedProperties, checkWebWorker };
const getNavigator = () => {
const data = [
{
key: 'deviceMemory',
title: 'Device memory',
- value: navigator.deviceMemory || 'N/A',
+ value: navigator.deviceMemory,
},
{
key: 'hardwareConcurrency',
title: 'Hardware Concurrency',
- value: navigator.hardwareConcurrency || 'N/A',
+ value: navigator.hardwareConcurrency,
},
{
key: 'maxTouchPoints',
title: 'Max touchpoints',
- value: navigator.maxTouchPoints || 'N/A',
+ value: navigator.maxTouchPoints,
},
{
key: 'platform',
title: 'Platform',
- value: navigator.platform || 'N/A',
+ value: navigator.platform,
},
{
key: 'userAgent',
title: 'User agent',
- value: navigator.userAgent || 'N/A',
+ value: navigator.userAgent,
},
{
key: 'language',
title: 'Language',
- value: navigator.language || 'N/A',
+ value: navigator.language,
},
{
key: 'languages',
title: 'Languages',
- value: navigator.languages || 'N/A',
+ value: navigator.languages,
},
{
key: 'cookieEnabled',
@@ -56,30 +56,30 @@ const getNavigator = () => {
{
key: 'plugins',
title: 'Plugins',
- value: sortPlugins(navigator.plugins) || 'N/A',
+ value: sortPlugins(navigator.plugins),
},
// {
// key: 'connection',
// title: 'Connection',
- // value: JSON.stringify(navigator.connection) || 'N/A',
+ // value: JSON.stringify(navigator.connection),
// prototype: Navigator.prototype.hardwareConcurrency,
// },
// {
// key: 'geolocation',
// title: 'Geolocation',
- // value: navigator.geolocation || 'N/A',
+ // value: navigator.geolocation,
// prototype: Navigator.prototype.hardwareConcurrency,
// },
// {
// key: 'hid',
// title: 'Hid',
- // value: navigator.hid || 'N/A',
+ // value: navigator.hid,
// prototype: Navigator.prototype.hardwareConcurrency,
// },
// {
// key: 'keyboard',
// title: 'Keyboard',
- // value: navigator.keyboard || 'N/A',
+ // value: navigator.keyboard,
// prototype: Navigator.prototype.hardwareConcurrency,
// },
{
@@ -90,22 +90,17 @@ const getNavigator = () => {
{
key: 'vendor',
title: 'Vendor',
- value: navigator.vendor || 'N/A',
+ value: navigator.vendor,
},
{
key: 'appVersion',
title: 'App version',
- value: navigator.appVersion || 'N/A',
+ value: navigator.appVersion,
},
{
key: 'productSub',
title: 'Product sub',
- value: navigator.productSub || 'N/A',
- },
- {
- key: 'vendorSub',
- title: 'Vendor sub',
- value: navigator.vendorSub || 'N/A',
+ value: navigator.productSub,
},
];
return data;
@@ -149,18 +144,23 @@ const checkUndefinedProperties = (obj) => {
// document.body.appendChild(frame);
// }
// console.log(navigator.hardwareConcurrency);
- let w;
- if (typeof Worker !== 'undefined') {
- if (typeof w === 'undefined') {
- w = new Worker('/worker.js');
- }
- w.onmessage = (event) => {
- console.log(event);
- };
- } else {
- document.getElementById('result').innerHTML =
- 'Sorry! No Web Worker support.';
- }
return list.toString().split(',').join('
');
};
+
+const checkWebWorker = (obj, setWorkerData) => {
+ let w;
+ if (typeof w === 'undefined') {
+ w = new Worker('/worker.js');
+ }
+ w.postMessage(obj.key);
+ w.onmessage = (event) => {
+ if (
+ event.data !== undefined &&
+ event.data.toString() !== navigator[obj.key].toString()
+ ) {
+ console.log(event.data, navigator[obj.key]);
+ setWorkerData('Did not match web worker');
+ }
+ };
+};
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 12c79a4..eff3e31 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -9134,6 +9134,11 @@ react-tsparticles@^1.28.0:
tslib "^2.2.0"
tsparticles "^1.28.0"
+react-webworker@^2.1.0:
+ version "2.1.0"
+ resolved "https://registry.yarnpkg.com/react-webworker/-/react-webworker-2.1.0.tgz#6bfe5d74d3f3e5bae89f316b8760b3e8cc551420"
+ integrity sha512-Rl0LeJa7zAQHAZ5KpyWQ/7aHcdy6AKJcJI7UIGlFo2e2sJw7u87hg4ck1cWb70DO0PrW0NwNZrMCgTi23g09JQ==
+
react@^17.0.2:
version "17.0.2"
resolved "https://registry.npmjs.org/react/-/react-17.0.2.tgz"