diff --git a/app/soapbox/containers/soapbox.js b/app/soapbox/containers/soapbox.js index e5f0de6fdf..4131600922 100644 Binary files a/app/soapbox/containers/soapbox.js and b/app/soapbox/containers/soapbox.js differ diff --git a/app/soapbox/main.tsx b/app/soapbox/main.tsx index 0a9bbdb75f..9505ae07ad 100644 --- a/app/soapbox/main.tsx +++ b/app/soapbox/main.tsx @@ -6,6 +6,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; import * as BuildConfig from 'soapbox/build_config'; +import { printConsoleWarning } from 'soapbox/utils/console'; import { default as Soapbox } from './containers/soapbox'; import * as monitoring from './monitoring'; @@ -18,6 +19,11 @@ function main() { // Sentry monitoring.start(); + // Print console warning + if (BuildConfig.NODE_ENV === 'production') { + printConsoleWarning(); + } + ready(() => { const mountNode = document.getElementById('soapbox') as HTMLElement; diff --git a/app/soapbox/utils/console.ts b/app/soapbox/utils/console.ts new file mode 100644 index 0000000000..96f8b6b5ed --- /dev/null +++ b/app/soapbox/utils/console.ts @@ -0,0 +1,24 @@ +/** Print a warning to users not to copy-paste into the console */ +const printConsoleWarning = () => { + /* eslint-disable no-console */ + console.log('%cStop!', [ + 'color: #ff0000', + 'display: block', + 'font-family: system-ui, -apple-system, BlinkMacSystemFont, Ubuntu, "Helvetica Neue", sans-serif', + 'font-size: 50px', + 'font-weight: 800', + 'padding: 4px 0', + ].join(';')); + console.log('%cThis is a browser feature intended for developers. If someone told you to copy-paste something here it is a scam and will give them access to your account.', [ + 'color: #111111', + 'display: block', + 'font-family: system-ui, -apple-system, BlinkMacSystemFont, Ubuntu, "Helvetica Neue", sans-serif', + 'font-size: 18px', + 'padding: 4px 0 16px', + ].join(';')); + /* eslint-enable no-console */ +}; + +export { + printConsoleWarning, +};