From d06ebdeee4815ab0882419d42985f1adf31d9b6b Mon Sep 17 00:00:00 2001 From: Nolan Lawson Date: Sat, 9 Mar 2024 09:37:31 -0800 Subject: [PATCH] chore: switch from process.env to importa.meta.env --- rollup.config.js | 8 ++++---- src/database/utils/jsonChecksum.js | 2 +- src/picker/components/Picker/Picker.js | 4 ++-- src/picker/components/Picker/framework.js | 16 ++++++++-------- src/picker/components/Picker/reactivity.js | 6 +++--- src/picker/components/Picker/utils.js | 2 +- src/picker/utils/calculateTextWidth.js | 2 +- src/picker/utils/emojiSupport.js | 2 +- src/picker/utils/testColorEmojiSupported.js | 2 +- 9 files changed, 22 insertions(+), 22 deletions(-) diff --git a/rollup.config.js b/rollup.config.js index bc5a91d..7e310fa 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -6,7 +6,7 @@ import analyze from 'rollup-plugin-analyzer' import { minifyHtmlLiteralsRollupPlugin } from './config/minifyHtmlLiteralsRollupPlugin.js' import { buildStylesRollupPlugin } from './config/buildStylesRollupPlugin.js' -const { NODE_ENV, DEBUG } = process.env +const { NODE_ENV, DEBUG, PERF } = process.env const dev = NODE_ENV !== 'production' // Build Database.test.js and Picker.js as separate modules at build times so that they are properly tree-shakeable. @@ -16,8 +16,8 @@ const baseConfig = { resolve(), cjs(), replace({ - 'process.env.NODE_ENV': dev ? '"development"' : '"production"', - 'process.env.PERF': !!process.env.PERF, + 'import.meta.env.MODE': dev ? '"development"' : '"production"', + 'import.meta.env.PERF': !!PERF, preventAssignment: true }), replace({ @@ -30,7 +30,7 @@ const baseConfig = { strip({ include: ['**/*.js'], functions: [ - (!dev && !process.env.PERF) && 'performance.*', + (!dev && !PERF) && 'performance.*', !dev && 'console.log' ].filter(Boolean) }), diff --git a/src/database/utils/jsonChecksum.js b/src/database/utils/jsonChecksum.js index 4d5cb8b..2d5c718 100644 --- a/src/database/utils/jsonChecksum.js +++ b/src/database/utils/jsonChecksum.js @@ -6,7 +6,7 @@ export async function jsonChecksum (object) { const inString = JSON.stringify(object) let inBuffer = binaryStringToArrayBuffer(inString) /* istanbul ignore else */ - if (process.env.NODE_ENV === 'test') { + if (import.meta.env.MODE === 'test') { // For whatever reason Node's built-in crypto throws an error for ArrayBuffers inBuffer = Buffer.from(new Uint8Array(inBuffer)) } diff --git a/src/picker/components/Picker/Picker.js b/src/picker/components/Picker/Picker.js index ed24830..a13bace 100644 --- a/src/picker/components/Picker/Picker.js +++ b/src/picker/components/Picker/Picker.js @@ -362,7 +362,7 @@ export function createRoot (shadowRoot, props) { function calculateEmojiGridStyle (node) { calculateWidth(node, abortSignal, width => { /* istanbul ignore next */ - if (process.env.NODE_ENV !== 'test') { // jsdom throws errors for this kind of fancy stuff + if (import.meta.env.MODE !== 'test') { // jsdom throws errors for this kind of fancy stuff // read all the style/layout calculations we need to make const style = getComputedStyle(refs.rootElement) const newNumColumns = parseInt(style.getPropertyValue('--num-columns'), 10) @@ -467,7 +467,7 @@ export function createRoot (shadowRoot, props) { createEffect(() => { // consider initialLoad to be complete when the first tabpanel and favorites are rendered /* istanbul ignore next */ - if (process.env.NODE_ENV !== 'production' || process.env.PERF) { + if (import.meta.env.MODE !== 'production' || import.meta.env.PERF) { if (state.currentEmojis.length && state.currentFavorites.length && state.initialLoad) { state.initialLoad = false requestPostAnimationFrame(() => performance.measure('initialLoad', 'initialLoad')) diff --git a/src/picker/components/Picker/framework.js b/src/picker/components/Picker/framework.js index 8b7dd16..367de4f 100644 --- a/src/picker/components/Picker/framework.js +++ b/src/picker/components/Picker/framework.js @@ -6,7 +6,7 @@ const unkeyedSymbol = Symbol('un-keyed') // for debugging /* istanbul ignore else */ -if (process.env.NODE_ENV !== 'production') { +if (import.meta.env.MODE !== 'production') { window.parseCache = parseCache window.domInstancesCache = domInstancesCache } @@ -37,7 +37,7 @@ function doChildrenNeedRerender (parentNode, newChildren) { oldChildrenCount++ } /* istanbul ignore if */ - if (process.env.NODE_ENV !== 'production' && oldChildrenCount !== parentNode.children.length) { + if (import.meta.env.MODE !== 'production' && oldChildrenCount !== parentNode.children.length) { throw new Error('parentNode.children.length is different from oldChildrenCount, it should not be') } // if new children length is different from old, we must re-render @@ -94,7 +94,7 @@ function patch (expressions, instanceBindings) { } else if (expression instanceof Element) { // html tag template returning a DOM element newNode = expression /* istanbul ignore if */ - if (process.env.NODE_ENV !== 'production' && newNode === targetNode) { + if (import.meta.env.MODE !== 'production' && newNode === targetNode) { // it seems impossible for the framework to get into this state, may as well assert on it // worst case scenario is we lose focus if we call replaceWith on the same node throw new Error('the newNode and targetNode are the same, this should never happen') @@ -140,7 +140,7 @@ function parse (tokens) { case '<': { const nextChar = token.charAt(j + 1) /* istanbul ignore if */ - if (process.env.NODE_ENV !== 'production' && !/[/a-z]/.test(nextChar)) { + if (import.meta.env.MODE !== 'production' && !/[/a-z]/.test(nextChar)) { // we don't need to support comments (' 2 < 3 ' throw new Error('framework currently only supports a < followed by / or a-z') @@ -161,7 +161,7 @@ function parse (tokens) { } case '=': { /* istanbul ignore if */ - if (process.env.NODE_ENV !== 'production' && !withinTag) { + if (import.meta.env.MODE !== 'production' && !withinTag) { // we don't currently support '=' anywhere but inside a tag, e.g. // we don't support '
2 + 2 = 4
' throw new Error('framework currently does not support = anywhere but inside a tag') @@ -194,7 +194,7 @@ function parse (tokens) { } /* istanbul ignore else */ - if (process.env.NODE_ENV !== 'production') { + if (import.meta.env.MODE !== 'production') { // remind myself that this object is supposed to be immutable Object.freeze(binding) } @@ -246,7 +246,7 @@ function traverseAndSetupBindings (dom, elementsToBindings) { : findPlaceholderComment(element, i) // not an attribute binding, so has a placeholder comment /* istanbul ignore if */ - if (process.env.NODE_ENV !== 'production' && !targetNode) { + if (import.meta.env.MODE !== 'production' && !targetNode) { throw new Error('targetNode should not be undefined') } @@ -258,7 +258,7 @@ function traverseAndSetupBindings (dom, elementsToBindings) { } /* istanbul ignore else */ - if (process.env.NODE_ENV !== 'production') { + if (import.meta.env.MODE !== 'production') { // remind myself that this object is supposed to be monomorphic (for better JS engine perf) Object.seal(instanceBinding) } diff --git a/src/picker/components/Picker/reactivity.js b/src/picker/components/Picker/reactivity.js index b74357f..61e1b65 100644 --- a/src/picker/components/Picker/reactivity.js +++ b/src/picker/components/Picker/reactivity.js @@ -17,7 +17,7 @@ export function createState (abortSignal) { return } /* istanbul ignore if */ - if (process.env.NODE_ENV !== 'production' && recursionDepth === MAX_RECURSION_DEPTH) { + if (import.meta.env.MODE !== 'production' && recursionDepth === MAX_RECURSION_DEPTH) { throw new Error('max recursion depth, you probably didn\'t mean to do this') } const observersToRun = [...dirtyObservers] @@ -82,7 +82,7 @@ export function createState (abortSignal) { // for debugging /* istanbul ignore else */ - if (process.env.NODE_ENV !== 'production') { + if (import.meta.env.MODE !== 'production') { window.state = state } @@ -91,7 +91,7 @@ export function createState (abortSignal) { destroyed = true /* istanbul ignore else */ - if (process.env.NODE_ENV !== 'production') { + if (import.meta.env.MODE !== 'production') { delete window.state } }) diff --git a/src/picker/components/Picker/utils.js b/src/picker/components/Picker/utils.js index 847ffd8..d556ef0 100644 --- a/src/picker/components/Picker/utils.js +++ b/src/picker/components/Picker/utils.js @@ -16,7 +16,7 @@ export function parseTemplate (htmlString) { template.innerHTML = htmlString /* istanbul ignore next */ - if (process.env.NODE_ENV !== 'production') { + if (import.meta.env.MODE !== 'production') { if (template.content.children.length !== 1) { throw new Error('only 1 child allowed for now') } diff --git a/src/picker/utils/calculateTextWidth.js b/src/picker/utils/calculateTextWidth.js index 53b995b..7d83e72 100644 --- a/src/picker/utils/calculateTextWidth.js +++ b/src/picker/utils/calculateTextWidth.js @@ -1,7 +1,7 @@ // get the width of the text inside of a DOM node, via https://stackoverflow.com/a/59525891/680742 export function calculateTextWidth (node) { /* istanbul ignore else */ - if (process.env.NODE_ENV === 'test') { + if (import.meta.env.MODE === 'test') { return 1 } else { const range = document.createRange() diff --git a/src/picker/utils/emojiSupport.js b/src/picker/utils/emojiSupport.js index 45b3bff..1e590e3 100644 --- a/src/picker/utils/emojiSupport.js +++ b/src/picker/utils/emojiSupport.js @@ -15,7 +15,7 @@ export const detectEmojiSupportLevel = () => { )) /* istanbul ignore else */ - if (process.env.NODE_ENV !== 'production') { + if (import.meta.env.MODE !== 'production') { promise.then(emojiSupportLevel => { console.log('emoji support level', emojiSupportLevel) }) diff --git a/src/picker/utils/testColorEmojiSupported.js b/src/picker/utils/testColorEmojiSupported.js index 94e058b..784365b 100644 --- a/src/picker/utils/testColorEmojiSupported.js +++ b/src/picker/utils/testColorEmojiSupported.js @@ -42,7 +42,7 @@ const compareFeatures = (feature1, feature2) => { } export function testColorEmojiSupported (text) { - if (process.env.NODE_ENV === 'test') { + if (import.meta.env.MODE === 'test') { if (simulateCanvasError) { throw new Error('canvas error') } else if (simulateOldBrowser) {