analogger 1.20.1 → 1.20.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/CHANGELOG.md +3 -1
  2. package/README.md +7 -3
  3. package/browser/src/ana-logger.mjs +158 -103
  4. package/browser/src/constants.mjs +2 -0
  5. package/dist/ana-light.min.css +1 -0
  6. package/dist/analogger-browser.min.mjs +3 -3
  7. package/dist/analogger.min.css +1 -1
  8. package/esm/src/ana-logger.mjs +158 -103
  9. package/esm/src/constants.mjs +2 -0
  10. package/package.json +4 -4
  11. package/src/ana-logger.cjs +157 -103
  12. package/src/constants.cjs +2 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,7 @@
1
- ## [1.20.1](https://github.com/thimpat/analogger/compare/v1.20.0...v1.20.1) (2022-09-06)
1
+ ## [1.20.2](https://github.com/thimpat/analogger/compare/v1.20.1...v1.20.2) (2022-09-07)
2
2
 
3
+ ## [1.20.1](https://github.com/thimpat/analogger/compare/v1.20.0...v1.20.1) (2022-09-06)
4
+
3
5
  # [1.20.0](https://github.com/thimpat/analogger/compare/v1.19.0...v1.20.0) (2022-09-05)
4
6
 
5
7
  # [1.19.0](https://github.com/thimpat/analogger/compare/v1.18.3...v1.19.0) (2022-09-03)
package/README.md CHANGED
@@ -22,7 +22,7 @@ npm install analogger
22
22
 
23
23
  ## Usage
24
24
 
25
- ### CommonJs
25
+ ### CommonJs (in Node)
26
26
 
27
27
  ```javascript
28
28
  const {anaLogger} = require("analogger");
@@ -30,7 +30,7 @@ const {anaLogger} = require("analogger");
30
30
 
31
31
  <br/>
32
32
 
33
- ### ESM
33
+ ### ESM (in Node)
34
34
 
35
35
  ```javascript
36
36
  import {anaLogger} from "analogger"
@@ -38,7 +38,7 @@ import {anaLogger} from "analogger"
38
38
 
39
39
  <br/>
40
40
 
41
- ### In the Browser
41
+ ### As ESM module (In the Browser)
42
42
 
43
43
  ```html
44
44
  <!DOCTYPE html>
@@ -50,6 +50,10 @@ import {anaLogger} from "analogger"
50
50
  <!-- AnaLogger Theme -->
51
51
  <link rel="stylesheet" href="../dist/analogger.min.css">
52
52
 
53
+ <!-- or another AnaLogger Theme
54
+ <link rel="stylesheet" href="../dist/ana-light.min.css">
55
+ -->
56
+
53
57
  </head>
54
58
  <body>
55
59
 
package/browser/src/ana-logger.mjs CHANGED
@@ -10,6 +10,7 @@ import {
10
10
  PREDEFINED_FORMATS, ANALOGGER_NAME, LINE_CLASSNAME
11
11
  } from "./constants.mjs";
12
12
  import {stringify} from "../imported/flatted/esm/index.mjs";
13
+ import {CONSOLE_HEADER_CLASSNAME, CONSOLE_FOOTER_CLASSNAME} from "./constants.mjs";
13
14
  let getTerminalWidth = () => null;
14
15
 
15
16
 
@@ -63,6 +64,7 @@ export const DEFAULT_LOG_CONTEXTS = {
63
64
  };
64
65
 
65
66
 
67
+
66
68
  const EOL = `
67
69
  `;
68
70
 
@@ -149,6 +151,42 @@ const symbolNames = {
149
151
  writing_hand : "✍",
150
152
  };
151
153
 
154
+ // --------------------------------------------------
155
+ // Helpers
156
+ // --------------------------------------------------
157
+ /**
158
+ * https://stackoverflow.com/questions/17575790/environment-detection-node-js-or-browser
159
+ * @returns {string}
160
+ */
161
+ function detectEnvironment()
162
+ {
163
+ if (typeof process === "object")
164
+ {
165
+ if (typeof process.versions === "object")
166
+ {
167
+ if (typeof process.versions.node !== "undefined")
168
+ {
169
+ return SYSTEM.NODE;
170
+ }
171
+ }
172
+ }
173
+ return SYSTEM.BROWSER;
174
+ }
175
+
176
+ const currentSystem = detectEnvironment();
177
+
178
+ /**
179
+ * Tell whether we are in a Node environment
180
+ * @returns {boolean}
181
+ */
182
+ function isNode()
183
+ {
184
+ return currentSystem === SYSTEM.NODE;
185
+ }
186
+
187
+ /**
188
+ *
189
+ */
152
190
  class ____AnaLogger
153
191
  {
154
192
  system = "";
@@ -183,8 +221,7 @@ class ____AnaLogger
183
221
  #realConsoleWarn = console.warn;
184
222
  #realConsoleError = console.error;
185
223
  #realConsoleDebug = console.debug;
186
-
187
- isBrowser0 = null;
224
+ #realConsoleTable = console.table;
188
225
 
189
226
  static ALIGN = {
190
227
  LEFT : "LEFT",
@@ -203,9 +240,11 @@ class ____AnaLogger
203
240
 
204
241
  originalFormatFunction;
205
242
 
243
+
206
244
  constructor({name = "default"} = {})
207
245
  {
208
- this.system = (typeof process === "object") ? SYSTEM.NODE : SYSTEM.BROWSER;
246
+ this.system = detectEnvironment();
247
+
209
248
  this.format = this.onBuildLog.bind(this);
210
249
  this.originalFormatFunction = this.format;
211
250
 
@@ -235,14 +274,11 @@ class ____AnaLogger
235
274
 
236
275
  console.table = this.table;
237
276
  console.buildTable = this.buildTable;
238
- console.isNode = this.isNode;
239
- console.isBrowser = this.isBrowser;
240
277
  console.truncateMessage = this.truncateMessage;
241
278
  console.rawLog = this.rawLog;
242
279
  console.rawInfo = this.rawInfo;
243
280
  console.rawWarn = this.rawWarn;
244
281
  console.rawError = this.rawError;
245
- console.isBrowser0 = this.system === SYSTEM.BROWSER;
246
282
 
247
283
  this.ALIGN = ____AnaLogger.ALIGN;
248
284
  this.ENVIRONMENT_TYPE = ____AnaLogger.ENVIRONMENT_TYPE;
@@ -293,13 +329,23 @@ class ____AnaLogger
293
329
  return history.join(symbol);
294
330
  }
295
331
 
332
+ forceEnvironment(system)
333
+ {
334
+ this.forcedSystem = system;
335
+ }
336
+
296
337
  /**
297
338
  * Tell whether we are in a Node environment
298
339
  * @returns {boolean}
299
340
  */
300
341
  isNode()
301
342
  {
302
- return this.system === SYSTEM.NODE;
343
+ if (this && this.forcedSystem)
344
+ {
345
+ return this.forcedSystem === SYSTEM.NODE;
346
+ }
347
+
348
+ return isNode();
303
349
  }
304
350
 
305
351
  /**
@@ -328,7 +374,14 @@ class ____AnaLogger
328
374
  this.options.logToDom = undefined;
329
375
  this.options.logToFile = undefined;
330
376
  this.options.logToRemote = undefined;
377
+ this.options.logToRemoteUrl = undefined;
378
+ this.options.logToRemoteBinaryUrl = undefined;
331
379
  this.options.logToDomlogToFile = undefined;
380
+ this.options.protocol = undefined;
381
+ this.options.host = undefined;
382
+ this.options.port = undefined;
383
+ this.options.pathname = undefined;
384
+ this.options.binarypathname = undefined;
332
385
  }
333
386
 
334
387
  resetOptions()
@@ -349,6 +402,8 @@ class ____AnaLogger
349
402
  logToDom = undefined,
350
403
  logToFile = undefined,
351
404
  logToRemote = undefined,
405
+ logToRemoteUrl = undefined,
406
+ logToRemoteBinaryUrl = undefined,
352
407
  loopback = DEFAULT.loopback,
353
408
  requiredLogLevel = DEFAULT_LOG_LEVELS.LOG,
354
409
  oneConsolePerContext = undefined,
@@ -367,16 +422,6 @@ class ____AnaLogger
367
422
  this.options.messageLenMax = messageLenMax;
368
423
  this.options.symbolLenMax = symbolLenMax;
369
424
 
370
- if (hidePassingTests !== undefined)
371
- {
372
- this.options.hidePassingTests = !!hidePassingTests;
373
- }
374
-
375
- if (hideHookMessage !== undefined)
376
- {
377
- this.options.hideHookMessage = !!hideHookMessage;
378
- }
379
-
380
425
  this.options.requiredLogLevel = requiredLogLevel;
381
426
 
382
427
  // TODO: Make one of silent or hideToLog options obsolete
@@ -390,48 +435,50 @@ class ____AnaLogger
390
435
  solveSilent = !!hideLog;
391
436
  }
392
437
 
393
- if (solveSilent)
394
- {
395
- this.options.hideLog = !!solveSilent;
396
- }
397
-
398
- if (hideError !== undefined)
438
+ // Force boolean type
439
+ [
440
+ {hideLog: solveSilent},
441
+ {oneConsolePerContext},
442
+ {hideError},
443
+ {hideHookMessage},
444
+ {hidePassingTests},
445
+ {logToRemote},
446
+ ].forEach((feature) =>
399
447
  {
400
- this.options.hideError = !!hideError;
401
- }
448
+ const key = Object.keys(feature)[0];
449
+ const val = feature[key];
450
+ if (val !== undefined)
451
+ {
452
+ this.options[key] = !!val;
453
+ }
454
+ });
402
455
 
403
- if (oneConsolePerContext !== undefined)
404
- {
405
- this.options.oneConsolePerContext = !!oneConsolePerContext;
406
- }
456
+ // Any type
457
+ [
458
+ {logToRemoteBinaryUrl},
459
+ {logToRemoteUrl},
460
+ {loopback},
461
+ {protocol},
462
+ {host},
463
+ {port},
464
+ {pathname},
465
+ {binarypathname},
466
+ ].forEach((feature) =>
467
+ {
468
+ const key = Object.keys(feature)[0];
469
+ const val = feature[key];
470
+ if (val !== undefined)
471
+ {
472
+ this.options[key] = val;
473
+ }
474
+ });
407
475
 
476
+ // Special cases
408
477
  if (logToDom !== undefined)
409
478
  {
410
479
  this.options.logToDom = logToDom || DEFAULT.consoleDomId;
411
480
  }
412
481
 
413
- if (loopback !== undefined)
414
- {
415
- this.options.loopback = loopback;
416
- }
417
-
418
- if (logToRemote !== undefined)
419
- {
420
- this.options.logToRemote = this.generateLogToRemoteUrl(logToRemote, {
421
- protocol,
422
- host,
423
- port,
424
- pathname
425
- });
426
-
427
- this.options.logToBinaryRemote = this.generateLogToRemoteUrl(logToRemote, {
428
- protocol,
429
- host,
430
- port,
431
- pathname: binarypathname || DEFAULT.binarypathname
432
- });
433
- }
434
-
435
482
  if (logToFile === false)
436
483
  {
437
484
  this.options.logToFile = false;
@@ -539,12 +586,9 @@ class ____AnaLogger
539
586
  }
540
587
  }
541
588
 
542
- if (!this.isBrowser0)
589
+ if (!availableLength)
543
590
  {
544
- if (!availableLength)
545
- {
546
- availableLength = getTerminalWidth() || process.stdout.columns || 120 - verticalSeparator.length - 1 - 5;
547
- }
591
+ availableLength = getTerminalWidth() || process.stdout.columns || 120 - verticalSeparator.length - 1 - 5;
548
592
  }
549
593
 
550
594
  availableLength = availableLength - 4;
@@ -1213,6 +1257,19 @@ class ____AnaLogger
1213
1257
  {
1214
1258
  const $container = this.$containers[i];
1215
1259
 
1260
+ let $header = $container.querySelector("." + CONSOLE_HEADER_CLASSNAME);
1261
+ if (!$header)
1262
+ {
1263
+ $header = document.createElement("div");
1264
+ $header.classList.add(CONSOLE_HEADER_CLASSNAME);
1265
+
1266
+ $header.append(document.createElement("span"));
1267
+ $header.append(document.createElement("span"));
1268
+ $header.append(document.createElement("span"));
1269
+
1270
+ $container.append($header);
1271
+ }
1272
+
1216
1273
  let $view = $container.querySelector("." + CONSOLE_AREA_CLASSNAME);
1217
1274
  if (!$view)
1218
1275
  {
@@ -1221,6 +1278,19 @@ class ____AnaLogger
1221
1278
  $container.append($view);
1222
1279
  }
1223
1280
 
1281
+ let $footer = $container.querySelector("." + CONSOLE_FOOTER_CLASSNAME);
1282
+ if (!$footer)
1283
+ {
1284
+ $footer = document.createElement("div");
1285
+ $footer.classList.add(CONSOLE_FOOTER_CLASSNAME);
1286
+
1287
+ $footer.append(document.createElement("span"));
1288
+ $footer.append(document.createElement("span"));
1289
+ $footer.append(document.createElement("span"));
1290
+
1291
+ $container.append($footer);
1292
+ }
1293
+
1224
1294
  const $line = document.createElement("div");
1225
1295
  $line.classList.add(LINE_CLASSNAME);
1226
1296
  if (context.className)
@@ -1259,9 +1329,15 @@ class ____AnaLogger
1259
1329
  {
1260
1330
  try
1261
1331
  {
1332
+ const urlDest = this.generateLogToRemoteUrl(this.options.logToRemoteUrl);
1333
+ if (!urlDest)
1334
+ {
1335
+ return null;
1336
+ }
1337
+
1262
1338
  const entry = [...data];
1263
1339
  const stringified = JSON.stringify(entry);
1264
- fetch(this.options.logToRemote, {
1340
+ fetch(urlDest, {
1265
1341
  method : "post",
1266
1342
  body : stringified,
1267
1343
  headers: {"Content-Type": "application/json"},
@@ -1291,13 +1367,19 @@ class ____AnaLogger
1291
1367
  return;
1292
1368
  }
1293
1369
 
1370
+ const urlDest = this.generateLogToRemoteUrl(this.options.logToRemoteBinaryUrl, {pathname: DEFAULT.binarypathname});
1371
+ if (!urlDest)
1372
+ {
1373
+ return null;
1374
+ }
1375
+
1294
1376
  let data = raw;
1295
1377
  if (info || lid)
1296
1378
  {
1297
1379
  data = JSON.stringify({raw, info, lid});
1298
1380
  }
1299
1381
 
1300
- fetch(this.options.logToBinaryRemote, {
1382
+ fetch(urlDest, {
1301
1383
  method: "post",
1302
1384
  body : data,
1303
1385
  })
@@ -1349,10 +1431,10 @@ class ____AnaLogger
1349
1431
  return text;
1350
1432
  }
1351
1433
 
1352
- writeToConsole(output, context, {isBrowser})
1434
+ writeToConsole(output, context)
1353
1435
  {
1354
1436
  const res = [output];
1355
- if (isBrowser)
1437
+ if (this.isBrowser())
1356
1438
  {
1357
1439
  res.push(`color: ${context.color}`);
1358
1440
  }
@@ -1457,7 +1539,7 @@ class ____AnaLogger
1457
1539
  return;
1458
1540
  }
1459
1541
 
1460
- this.writeToConsole(output, context, {isBrowser: this.isBrowser()});
1542
+ this.writeToConsole(output, context);
1461
1543
 
1462
1544
  this.errorTargetHandler(context, args);
1463
1545
  }
@@ -1697,12 +1779,17 @@ class ____AnaLogger
1697
1779
 
1698
1780
  table(...args)
1699
1781
  {
1782
+ if (this.isBrowser())
1783
+ {
1784
+ return this.#realConsoleTable(...args);
1785
+ }
1786
+
1700
1787
  return this.buildTable(...args);
1701
1788
  }
1702
1789
 
1703
1790
  alert(...args)
1704
1791
  {
1705
- if (this.isNode())
1792
+ if (!this.isBrowser())
1706
1793
  {
1707
1794
  return this.log(...args);
1708
1795
  }
@@ -1849,54 +1936,22 @@ class ____AnaLogger
1849
1936
  return url.toString();
1850
1937
  }
1851
1938
 
1852
- generateLogToRemoteUrl(logToRemote, {
1853
- protocol = DEFAULT.protocol,
1854
- host = DEFAULT.host || this.options.loopback,
1855
- port = DEFAULT.port,
1856
- pathname = DEFAULT.pathname
1857
- } = {})
1939
+ generateLogToRemoteUrl(logToRemoteUrl = null, {pathname = DEFAULT.pathname} = {})
1858
1940
  {
1859
- if (!logToRemote)
1860
- {
1861
- return false;
1862
- }
1863
-
1864
- if (typeof logToRemote === "string" || logToRemote instanceof String)
1865
- {
1866
- return logToRemote;
1867
- }
1868
-
1869
- if (Array.isArray(logToRemote))
1941
+ if (typeof logToRemoteUrl === "string" || logToRemoteUrl instanceof String)
1870
1942
  {
1871
- protocol = logToRemote[0] || protocol;
1872
- host = logToRemote[1] || host;
1873
- port = logToRemote[2] || port;
1874
- pathname = logToRemote[3] || pathname;
1875
-
1876
- return this.convertToUrl({protocol, host, port, pathname});
1943
+ return logToRemoteUrl;
1877
1944
  }
1878
1945
 
1879
- if (typeof logToRemote === "object")
1946
+ if (!this.isBrowser())
1880
1947
  {
1881
- // ({protocol, host, port, pathname} = logToRemote);
1882
- protocol = logToRemote.protocol || protocol;
1883
- host = logToRemote.host || host;
1884
- port = logToRemote.port || port;
1885
- pathname = logToRemote.pathname || pathname;
1886
-
1887
- return this.convertToUrl({protocol, host, port, pathname});
1948
+ return null;
1888
1949
  }
1889
1950
 
1890
- if (Number.isInteger(logToRemote))
1891
- {
1892
- if (logToRemote < 0 || logToRemote > 65535)
1893
- {
1894
- console.error({lid: 3037}, `Invalid port number for logToRemoteValue`);
1895
- return false;
1896
- }
1897
-
1898
- port = logToRemote;
1899
- }
1951
+ const protocol = this.options.protocol || window.location.protocol + "//";
1952
+ const host = this.options.host || window.location.host || DEFAULT.host;
1953
+ const port = this.options.port || DEFAULT.port;
1954
+ pathname = this.options.pathname || pathname;
1900
1955
 
1901
1956
  return this.convertToUrl({protocol, host, port, pathname});
1902
1957
  }
package/browser/src/constants.mjs CHANGED
@@ -37,7 +37,9 @@ export const COLOR_TABLE = constants.COLOR_TABLE;
37
37
  export const SYSTEM = constants.SYSTEM;
38
38
  export const MAX_CHILDREN_DOM_ANALOGGER = 2000;
39
39
  export const CLASS_REMOVED_NOTIF = "analogger-removed-notif";
40
+ export const CONSOLE_HEADER_CLASSNAME = "analogger-header";
40
41
  export const CONSOLE_AREA_CLASSNAME = "analogger-view";
42
+ export const CONSOLE_FOOTER_CLASSNAME = "analogger-footer";
41
43
  export const LINE_CLASSNAME = "to-esm-line";
42
44
 
43
45
  export const ADD_TYPE = {
package/dist/ana-light.min.css ADDED
@@ -0,0 +1 @@
1
+ html,body{height:100%}body{margin:0;overflow:hidden}.analogger{background-color:#ababab;box-shadow:1px 1px 4px 0 rgba(0,0,0,.3);box-sizing:border-box;display:flex;flex-direction:column;height:calc(100% - 12px);overflow:hidden;padding:0;position:relative;width:calc(100% - 8px)}.analogger .analogger-header{box-sizing:border-box;display:flex;flex:auto;height:38px;margin:0;padding:0;top:0;width:100%}.analogger .analogger-header span:nth-child(1){flex:auto;font-family:sans-serif;font-size:14px;width:80%}.analogger .analogger-header span:nth-child(2){flex:auto;font-family:sans-serif;font-size:14px}.analogger .analogger-header span:nth-child(3){flex:auto;font-family:sans-serif;font-size:22px;margin:0;padding:0 6px;text-align:right;width:20px}.analogger .analogger-footer{background:#7ba3cd59;bottom:3px;display:inline-block;height:33px;margin:0 0 0 3px;position:absolute;width:calc(100% - 6px)}.analogger .analogger-footer span:nth-child(1){font-family:sans-serif;font-size:14px}.analogger .analogger-view{background-color:#dddbdb;box-sizing:border-box;color:#faebd7;display:block;flex:auto;font-family:sans-serif;font-size:11px;line-height:30px;height:100%;margin:0 0 3px 3px;padding:0;overflow:auto;position:relative;width:calc(100% - 6px)}.analogger .analogger-view .to-esm-line{align-items:stretch;border-bottom:1px dashed #56499324;display:flex;justify-content:flex-start;height:26px;line-height:26px;overflow:hidden;vertical-align:middle;white-space:nowrap}.analogger .analogger-view .to-esm-line.analogger-removed-notif{background-color:rgba(223,73,73,.51);color:#abb9b7;font-size:9px}.analogger .analogger-view .to-esm-line.analogger-removed-notif .analogger-col-symbol{font-size:18px}.analogger .analogger-view .to-esm-line .analogger-col{overflow:hidden;padding:0 4px;text-overflow:ellipsis;white-space:nowrap}.analogger .analogger-view .to-esm-line .analogger-col-contextName{flex-grow:1;max-width:60px;text-align:right}.analogger .analogger-view .to-esm-line .analogger-col-target{flex-grow:1;max-width:60px;text-align:right}.analogger .analogger-view .to-esm-line .analogger-col-symbol{flex-grow:1;max-width:40px;text-align:center}.analogger .analogger-view .to-esm-line .analogger-col-text{flex-grow:1}.analogger .analogger-view::-webkit-scrollbar-thumb{border:5px solid transparent;border-radius:100px;background-color:#514b6e;background-clip:content-box}.analogger .analogger-view::-webkit-scrollbar{width:14px}.analogger .analogger-view::-webkit-scrollbar-track{background-color:#382525;border-radius:100px}.analogger .analogger-view::-webkit-scrollbar-thumb{border-radius:100px;border:4px solid transparent;background-clip:content-box;background-color:#9f6c53}