fix: use small modules for userAgent.js instead of terser magic (#1602)

bin/terserOptions.js

@@ -3,8 +3,7 @@ module.exports = {
   mangle: true,
   compress: {
     pure_funcs: [
-      'console.log', // remove console logs in production
+      'console.log' // remove console logs in production
-      '__thunk__' // see thunk.js
     ]
   },
   output: {

src/inline-script/inline-script.js

@@ -7,7 +7,8 @@ import { INLINE_THEME, DEFAULT_THEME, switchToTheme } from '../routes/_utils/the
 import { basename } from '../routes/_api/utils'
 import { onUserIsLoggedOut } from '../routes/_actions/onUserIsLoggedOut'
 import { storeLite } from '../routes/_store/storeLite'
-import { isIOSPre12Point2, isMac } from '../routes/_utils/userAgent'
+import { isIOSPre12Point2 } from '../routes/_utils/userAgent/isIOSPre12Point2'
+import { isMac } from '../routes/_utils/userAgent/isMac'
 
 window.__themeColors = process.env.THEME_COLORS
 

src/routes/_pages/settings/hotkeys.html

@@ -39,7 +39,7 @@
   import SettingsLayout from '../../_components/settings/SettingsLayout.html'
   import ShortcutHelpInfo from '../../_components/ShortcutHelpInfo.html'
   import { store } from '../../_store/store'
-  import { isKaiOS } from '../../_utils/userAgent'
+  import { isKaiOS } from '../../_utils/userAgent/isKaiOS'
   import UISettingsStyles from '../../_components/settings/UISettingsStyles.html'
 
   export default {

src/routes/_static/media.js

@@ -1,4 +1,4 @@
-import { isIOSPre13 } from '../_utils/userAgent'
+import { isIOSPre13 } from '../_utils/userAgent/isIOSPre13'
 
 export const DEFAULT_MEDIA_WIDTH = 300
 export const DEFAULT_MEDIA_HEIGHT = 250

src/routes/_store/store.js

@@ -3,7 +3,7 @@ import { computations } from './computations/computations'
 import { mixins } from './mixins/mixins'
 import { LocalStorageStore } from './LocalStorageStore'
 import { observe } from 'svelte-extras'
-import { isKaiOS } from '../_utils/userAgent'
+import { isKaiOS } from '../_utils/userAgent/isKaiOS'
 
 const persistedState = {
   autoplayGifs: false,

src/routes/_utils/emojiRegex.js

@@ -1,4 +1,4 @@
 import emojiRegex from 'emoji-regex/es2015/text'
-import { __thunk__ } from './thunk'
+import { thunk } from './thunk'
 
-export const getEmojiRegex = __thunk__(emojiRegex)
+export const getEmojiRegex = thunk(emojiRegex)

src/routes/_utils/handleRegex.js

@@ -1,5 +1,5 @@
 /* eslint-disable */
-import { __thunk__ } from './thunk'
+import { thunk } from './thunk'
 
-export const handleRegex = __thunk__(() => /(^|[^\/\w])@(([a-z0-9_]+)@[a-z0-9\.\-]+[a-z0-9]+)/ig)
+export const handleRegex = thunk(() => /(^|[^\/\w])@(([a-z0-9_]+)@[a-z0-9\.\-]+[a-z0-9]+)/ig)
 /* eslint-enable */

src/routes/_utils/runMediumPriorityTask.js

@@ -1,6 +1,6 @@
 import { scheduleIdleTask } from './scheduleIdleTask'
 import { store } from '../_store/store'
-import { isMobile } from './userAgent'
+import { isMobile } from './userAgent/isMobile'
 
 // Rough guess at whether this is a "mobile" device or not, for the purposes
 // of "device class" estimations

src/routes/_utils/smoothScroll.js

@@ -1,5 +1,5 @@
 import { store } from '../_store/store'
-import { isChrome } from './userAgent'
+import { isChrome } from './userAgent/isChrome'
 
 // via https://github.com/tootsuite/mastodon/blob/f59ed3a4fafab776b4eeb92f805dfe1fecc17ee3/app/javascript/mastodon/scroll.js
 const easingOutQuint = (x, t, b, c, d) =>

src/routes/_utils/testStorage.js

@@ -1,11 +1,11 @@
 // LocalStorage and IDB may be disabled in private mode, when "blocking cookies" in Safari,
 // or other cases
 
-import { __thunk__ } from './thunk'
+import { thunk } from './thunk'
 
 const testKey = '__test__'
 
-export const testHasLocalStorage = __thunk__(() => {
+export const testHasLocalStorage = thunk(() => {
   try {
     localStorage.setItem(testKey, testKey)
     if (!localStorage.length || localStorage.getItem(testKey) !== testKey) {
@@ -18,7 +18,7 @@ export const testHasLocalStorage = __thunk__(() => {
   return true
 })
 
-export const testHasIndexedDB = __thunk__(async () => {
+export const testHasIndexedDB = thunk(async () => {
   if (typeof indexedDB === 'undefined') {
     return false
   }

src/routes/_utils/thunk.js

@@ -1,6 +1,5 @@
-// We name this __thunk__ so that we can tell terser that it's a pure function, without possibly
+// Run a function once, then cache the result and return the cached result thereafter
-// affecting third-party libraries that may also be using a function called "thunk".
+export function thunk (func) {
-export function __thunk__ (func) {
   let cached
   let runOnce
   return () => {

src/routes/_utils/urlRegex.js

@@ -1,6 +1,6 @@
-import { __thunk__ } from './thunk'
+import { thunk } from './thunk'
 
-export const urlRegex = __thunk__(() => {
+export const urlRegex = thunk(() => {
   // this is provided at build time to avoid having a lot of runtime code just to build
   // a static regex
   return process.env.URL_REGEX

src/routes/_utils/userAgent.js

@@ -1,24 +0,0 @@
-import { __thunk__ } from './thunk'
-
-export const isKaiOS = __thunk__(() => process.browser && /KAIOS/.test(navigator.userAgent))
-
-export const isIOS = __thunk__(() => process.browser && /iP(?:hone|ad|od)/.test(navigator.userAgent))
-
-export const isMac = __thunk__(() => process.browser && /mac/i.test(navigator.platform))
-
-// IntersectionObserver introduced in iOS 12.2 https://caniuse.com/#feat=intersectionobserver
-export const isIOSPre12Point2 = __thunk__(() => process.browser && isIOS() &&
-  !(typeof IntersectionObserver === 'function' &&
-    IntersectionObserver.toString().includes('[native code]')))
-
-// PointerEvent introduced in iOS 13 https://caniuse.com/#feat=pointer
-export const isIOSPre13 = __thunk__(() => process.browser && isIOS() &&
-  !(typeof PointerEvent === 'function' &&
-    PointerEvent.toString().includes('[native code]')))
-
-export const isMobile = __thunk__(() => process.browser && navigator.userAgent.match(/(?:iPhone|iPod|iPad|Android|KAIOS)/))
-
-export const isSafari = __thunk__(() => process.browser && /Safari/.test(navigator.userAgent) &&
-  !/Chrome/.test(navigator.userAgent))
-
-export const isChrome = __thunk__(() => process.browser && /Chrome/.test(navigator.userAgent))

src/routes/_utils/userAgent/isChrome.js

@@ -0,0 +1,3 @@
+import { thunk } from '../thunk'
+
+export const isChrome = thunk(() => process.browser && /Chrome/.test(navigator.userAgent))

src/routes/_utils/userAgent/isIOS.js

@@ -0,0 +1,3 @@
+import { thunk } from '../thunk'
+
+export const isIOS = thunk(() => process.browser && /iP(?:hone|ad|od)/.test(navigator.userAgent))

src/routes/_utils/userAgent/isIOSPre12Point2.js

@@ -0,0 +1,7 @@
+// IntersectionObserver introduced in iOS 12.2 https://caniuse.com/#feat=intersectionobserver
+import { thunk } from '../thunk'
+import { isIOS } from '../userAgent/isIOS'
+
+export const isIOSPre12Point2 = thunk(() => process.browser && isIOS() &&
+  !(typeof IntersectionObserver === 'function' &&
+    IntersectionObserver.toString().includes('[native code]')))

src/routes/_utils/userAgent/isIOSPre13.js

@@ -0,0 +1,7 @@
+// PointerEvent introduced in iOS 13 https://caniuse.com/#feat=pointer
+import { thunk } from '../thunk'
+import { isIOS } from '../userAgent/isIOS'
+
+export const isIOSPre13 = thunk(() => process.browser && isIOS() &&
+  !(typeof PointerEvent === 'function' &&
+    PointerEvent.toString().includes('[native code]')))

src/routes/_utils/userAgent/isKaiOS.js

@@ -0,0 +1,3 @@
+import { thunk } from '../thunk'
+
+export const isKaiOS = thunk(() => process.browser && /KAIOS/.test(navigator.userAgent))

src/routes/_utils/userAgent/isMac.js

@@ -0,0 +1,3 @@
+import { thunk } from '../thunk'
+
+export const isMac = thunk(() => process.browser && /mac/i.test(navigator.platform))

src/routes/_utils/userAgent/isMobile.js

@@ -0,0 +1,3 @@
+import { thunk } from '../thunk'
+
+export const isMobile = thunk(() => process.browser && navigator.userAgent.match(/(?:iPhone|iPod|iPad|Android|KAIOS)/))

src/routes/_utils/userAgent/isSafari.js

@@ -0,0 +1,4 @@
+import { thunk } from '../thunk'
+
+export const isSafari = thunk(() => process.browser && /Safari/.test(navigator.userAgent) &&
+  !/Chrome/.test(navigator.userAgent))

src/routes/_workers/blurhash.js

@@ -1,7 +1,7 @@
 import { decode as decodeBlurHash } from 'blurhash'
 import registerPromiseWorker from 'promise-worker/register'
 import { BLURHASH_RESOLUTION as RESOLUTION } from '../_static/blurhash'
-import { isChrome } from '../_utils/userAgent'
+import { isChrome } from '../_utils/userAgent/isChrome'
 
 // Disabled in Chrome because convertToBlob() is slow
 // https://github.com/nolanlawson/pinafore/issues/1396

src/service-worker.js

@@ -4,7 +4,7 @@ import {
   routes as __routes__
 } from '../__sapper__/service-worker.js'
 import { get, post } from './routes/_utils/ajax'
-import { isSafari } from './routes/_utils/userAgent'
+import { isSafari } from './routes/_utils/userAgent/isSafari'
 
 const timestamp = process.env.SAPPER_TIMESTAMP
 const ASSETS = `assets_${timestamp}`