JavaScript Not Working? 15 Common Causes and Fixes
When JavaScript isn't working, the failure can range from silent UI unresponsive states to explicit browser crashes. A broken script typically falls into one of these core failure categories:
- JavaScript not loading: Broken file paths, incorrect server MIME types, or 404 network responses.
- Syntax & Parse errors: Code fails to compile before execution even starts.
- Console runtime errors: Uncaught exceptions (e.g.,
TypeError,ReferenceError) halt execution threads. - Functions not executing: Unbound event handlers, invalid CSS selectors, or missing target DOM nodes.
- DOM manipulation failing: Script execution attempting to read/modify DOM nodes before parsing.
- Module import failures: Incorrect path resolution, CORS blocking local file imports, or missing
type="module"attributes. - Asynchronous execution flaws: Unhandled Promise rejections, missing
awaitstatements, or race conditions. - Network & API failures: Broken
fetch()calls, CORS security policy blocks, or bad HTTP status responses. - Environment mismatches: Code running locally fine but breaking post-deployment due to asset caching or missing environment variables.
Diagnostic Rule: Randomly altering code without checking diagnostics wastes time. The most effective path to resolution is identifying the specific point of failure using a structured verification sequence.
Quick Troubleshooting Checklist
Work through this diagnostic checklist sequentially before modifying application code:
- Open Browser Developer Tools: Press F12 (or Cmd + Option + I on macOS).
- Inspect the Console Tab: Look for red error messages. The top error is your primary target.
- Inspect the Network Tab: Filter by
JS(orFetch/XHRfor data). Check if script files return HTTP 200, 304, 404, or 500 status codes. - Confirm Script File Loading: Locate your script in the Sources panel. If it's missing, the browser never loaded the file.
- Verify Script URL Path: Ensure relative paths match your server routing structure.
- Verify Execution Flow: Insert
console.log('Execution point reached')at the top of your file or set a breakpoint in DevTools. - Verify Target DOM Elements: In the Console, run
document.querySelector('YOUR_SELECTOR')to confirm the element exists when queried. - Verify Event Listener Registration: Inspect the target element in the Elements panel and check its Event Listeners sub-tab.
- Check for Uncaught Rejections: Enable "Pause on exceptions" in the DevTools Sources tab.
15 Common Causes of Broken JavaScript and How to Fix Them
1. Incorrect Script Path or 404 File Load Error
What happens: The browser fails to load the script file, resulting in a GET http://.../app.js 404 (Not Found) error in the DevTools console.
Why it happens: The src path in the <script> tag is invalid relative to the root URL or current document directory, or post-compilation asset paths changed.
How to diagnose it: Open the Network tab, reload the page, filter by JS, and inspect the HTTP response code for your script file.
How to fix it: Correct the path relative to your web server root or static asset directory.
BAD EXAMPLE<!-- Assuming index.html is in /public, but app.js is in /public/js/app.js -->
<script src="app.js"></script><script src="./js/app.js"></script>
<!-- Or using root-relative path -->
<script src="/js/app.js"></script>How to verify the fix: The file status in the Network tab must display 200 OK or 304 Not Modified, and the file content appears in the Sources tab.
2. Script Executes Before the DOM Is Ready
What happens: DOM selection calls return null, leading to a TypeError: Cannot read properties of null (reading 'addEventListener').
Why it happens: The browser encounters a <script> tag in the <head> section and executes it immediately before parsing the rest of the HTML markup containing the target elements.
How to diagnose it: Check where your script tag is placed in the HTML document. Run document.querySelector() in the console to confirm the element exists later in the parse tree.
How to fix it: Add the defer attribute to external script tags placed in the <head>, or attach execution to the DOMContentLoaded event.
<head>
<script>
// Fails because #btn is not parsed yet
document.getElementById('btn').addEventListener('click', () => {});
</script>
</head>
<body>
<button id="btn">Click</button>
</body><head>
<!-- Option A: Using defer -->
<script src="app.js" defer></script>
</head>
<body>
<button id="btn">Click</button>
<!-- Option B: Event wrapper if using inline script -->
<script>
document.addEventListener('DOMContentLoaded', () => {
document.getElementById('btn').addEventListener('click', () => {});
});
</script>
</body>How to verify the fix: No TypeError appears in the console on page load, and variables holding DOM nodes log elements instead of null.
3. Syntax Errors Halting Script Execution
What happens: The browser refuses to evaluate the entire script file, generating an Uncaught SyntaxError (e.g., Unexpected token, Missing ) after argument list).
Why it happens: Unclosed brackets, dangling commas in strict mode, reserved keyword misuse, or missing quote marks prevent the JavaScript engine from parsing the file into an AST (Abstract Syntax Tree).
How to diagnose it: Look at the top error in the console. Click the line-number hyperlink adjacent to the error message to view the precise syntax token failure.
How to fix it: Correct the malformed syntax at the referenced line number.
BAD EXAMPLEconst user = {
name: "Alex"
age: 30 // Missing comma above causes SyntaxError
};
if (user.age > 18 { // Missing closing parenthesis
console.log("Adult");
}const user = {
name: "Alex",
age: 30
};
if (user.age > 18) {
console.log("Adult");
}How to verify the fix: The SyntaxError disappears from the console, and execution reaches subsequent code statements.
4. Reading Properties of undefined or null
What happens: Script halts mid-function with TypeError: Cannot read properties of undefined or Cannot read properties of null.
Why it happens: Code attempts to access a nested property or call a method on a reference that evaluated to undefined or null (e.g., failed database lookup, missing API key, invalid DOM query).
How to diagnose it: Check the error stack trace line number. Inspect the variable preceding the dot (.) operator using console.log() or a DevTools breakpoint.
How to fix it: Implement optional chaining (?.) or defensive conditional assertions.
function getCityState(user) {
// Throws TypeError if user or user.address is undefined
return user.address.city;
}
getCityState({});function getCityState(user) {
// Optional chaining prevents execution crash
return user?.address?.city ?? "City unavailable";
}
getCityState({});How to verify the fix: Passing incomplete object structures executes gracefully without throwing uncaught runtime exceptions.
5. Incorrect ES Module Configuration
What happens: Module statement errors occur, such as Uncaught SyntaxError: Cannot use import statement outside a module or Failed to resolve module specifier.
Why it happens: Browser script tags default to classic script execution mode where import and export statements are forbidden, or import paths lack explicit file extensions in browser environments.
How to diagnose it: Look for import statements at the top of your scripts and verify if the hosting script tag in the HTML includes type="module".
How to fix it: Add type="module" to the script tag in HTML and provide complete path references including file extensions (.js).
<script src="main.js"></script>
<!-- Inside main.js: import { helper } from './utils'; --><script src="main.js" type="module"></script>
<!-- Inside main.js: import { helper } from './utils.js'; -->How to verify the fix: The browser handles dependency resolution without throwing import syntax errors in the Console.
6. Event Listeners Attached to Non-Existent Elements
What happens: User clicks or interacts with UI components, but zero event handler logic executes. No error appears in the console.
Why it happens: document.querySelector() matched nothing because the selector was misspelled or the element was dynamically appended to the DOM after the event listener assignment code ran.
How to diagnose it: Log the element reference before running .addEventListener(). If it outputs null, the binding target does not exist in the DOM tree at that moment.
How to fix it: Use event delegation on a persistent parent element or re-bind listeners after dynamic element creation.
BAD EXAMPLE// Fails if .dynamic-btn is rendered via fetch later
const button = document.querySelector('.dynamic-btn');
button?.addEventListener('click', handleAction);// Event Delegation on persistent parent
document.addEventListener('click', (event) => {
if (event.target.matches('.dynamic-btn')) {
handleAction(event);
}
});How to verify the fix: Clicking dynamically added or late-rendered elements triggers the expected handler function.
7. Unhandled Promise Rejections and Unawaited Async Operations
What happens: An asynchronous function returns a Promise instead of the expected data payload, producing [object Promise] or failing with Uncaught (in promise) Error.
Why it happens: Functions declared with async automatically return Promises. Accessing their return values without await or .then() reads the pending Promise object instead of the resolved resolution value.
How to diagnose it: console.log() on the variable prints Promise {<pending>} or Promise {<fulfilled>: Value} instead of the raw data primitive or object.
How to fix it: Mark the outer caller scope as async and prepend await to the Promise call, wrapping in try/catch blocks.
async function fetchUserData() {
return { id: 101, name: "Sam" };
}
function displayUser() {
const user = fetchUserData();
// Prints: "User name: undefined" because user is a Promise!
console.log(`User name: ${user.name}`);
}async function fetchUserData() {
return { id: 101, name: "Sam" };
}
async function displayUser() {
try {
const user = await fetchUserData();
console.log(`User name: ${user.name}`); // Prints: "User name: Sam"
} catch (err) {
console.error("Failed to load user:", err);
}
}How to verify the fix: The underlying data structure resolves directly into the receiving variable without returning raw Promise wrappers.
8. fetch() Network Failures and Unchecked HTTP Status Codes
What happens: Data fails to process or display, but fetch() does not throw an error, leading to unexpected application state.
Why it happens: fetch() Promises do not reject on HTTP error status codes like 404 or 500. A fetch() Promise only rejects on network failures or blocked requests.
How to diagnose it: Check the Network tab for the request status. Check if your code verifies response.ok before reading response body JSON.
How to fix it: Check the .ok property on the Response object before calling .json().
async function loadData() {
const response = await fetch('/api/data-endpoint');
// If endpoint returns 500 or 404, .json() executes anyway or returns error payload
const data = await response.json();
renderUI(data);
}async function loadData() {
try {
const response = await fetch('/api/data-endpoint');
if (!response.ok) {
throw new Error(`HTTP Error Status: ${response.status}`);
}
const data = await response.json();
renderUI(data);
} catch (error) {
console.error("Network or API failure:", error);
}
}How to verify the fix: Failed API requests enter the catch block safely and display diagnostic status codes in console logs.
9. CORS (Cross-Origin Resource Sharing) Block
What happens: The network request fails, showing: Access to fetch at '...' from origin '...' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Why it happens: The browser's same-origin policy blocks client-side code from reading HTTP responses requested from a different domain, port, or protocol unless the target server sends explicit permission headers.
How to diagnose it: Look for explicit CORS policy error messages highlighted in red in the DevTools console, paired with red status lines in the Network tab.
How to fix it: Configure the target backend server to send the necessary Access-Control-Allow-Origin headers, or set up a reverse proxy server during local development.
HTTP/1.1 200 OK
Content-Type: application/json
/* Missing Access-Control-Allow-Origin header */// Backend server setup to allow cross-origin calls
const express = require('express');
const cors = require('cors');
const app = express();
app.use(cors({ origin: 'https://your-frontend-domain.com' }));How to verify the fix: The preflight OPTIONS request succeeds with HTTP status 200/204, and the subsequent GET/POST request successfully delivers the response payload.
10. Variable Scope and Shadowing Issues
What happens: A function uses outdated, missing, or unexpectedly modified variable values, producing incorrect logic branch decisions.
Why it happens: Re-declaring variables with identical names in inner scopes creates variable "shadowing," preventing inner blocks from accessing or updating outer variables as intended.
How to diagnose it: Set breakpoints inside and outside the scope block. Inspect the Scope panel in DevTools Sources to view Local, Closure, and Global scope variables.
How to fix it: Avoid duplicate variable identifiers across parent/child scopes and explicitly declare strict immutability defaults using const or mutable let.
let count = 10;
function updateCount() {
if (true) {
let count = 5; // Creates a local shadowed variable
count += 1; // Updates ONLY the local block variable
}
console.log(count); // Prints 10, NOT 6!
}let count = 10;
function updateCount() {
if (true) {
count += 1; // Correctly mutates outer scope variable
}
console.log(count); // Prints 11
}How to verify the fix: Outer scope state updates deterministically following variable manipulation inside conditional blocks or sub-functions.
11. Stale Asset Caching
What happens: Code updates saved on the server or deployed to production do not run in user browsers. The browser executes older, cached JavaScript assets instead.
Why it happens: Aggressive HTTP caching policy headers (Cache-Control) instruct browsers to load local disk-cached files instead of fetching updated scripts from the server.
How to diagnose it: Compare code running in DevTools Sources against your source code editor. If they differ, you are running a cached file version.
How to fix it: Disable cache while DevTools is open for testing. Implement asset cache-busting hashing strategies in production pipelines.
BAD EXAMPLE<!-- Browser caches filename indefinitely -->
<script src="app.js"></script><!-- Option A: File hashing via build tools (Webpack/Vite) -->
<script src="app.a8f9d32e.js"></script>
<!-- Option B: Query parameter busting (manual simple fix) -->
<script src="app.js?v=1.0.2"></script>How to verify the fix: Network tab confirms 200 OK (fetched from server) rather than 200 OK (from disk cache) or 304 Not Modified.
12. Blocked by Content Security Policy (CSP)
What happens: Console displays: Refused to execute inline script because it violates the following Content Security Policy directive....
Why it happens: The host web server includes a Content-Security-Policy HTTP header that disables unsafe inline scripts (<script>...</script>), eval(), or unapproved external script source domains.
How to diagnose it: Look for explicitly labeled security policy error notices in the DevTools console detailing which directive (script-src, default-src) blocked execution.
How to fix it: Move inline code to external .js files or add nonces/hashes/domain allowlists to the CSP configuration header.
<!-- Inline handler violates strict CSP -->
<button onclick="alert('clicked')">Submit</button><!-- HTML -->
<button id="submit-btn">Submit</button>
<!-- JS File (app.js - allowed domain in CSP) -->
<script src="app.js" defer></script>
<!-- Inside app.js: document.getElementById('submit-btn')?.addEventListener('click', ...); -->How to verify the fix: Console displays zero CSP restriction warnings on page initialization.
13. Incorrect JavaScript MIME Type
What happens: The browser refuses to load and run a script file, logging: Refused to execute script from '...' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.
Why it happens: The web server returns an incorrect Content-Type header (such as text/html instead of text/javascript). This frequently happens when server routes fail to locate a file and default to sending an HTML 404 page response instead.
How to diagnose it: Click the script entry in the Network tab, inspect Response Headers, and check the value of Content-Type.
How to fix it: Configure the web server static asset router to serve .js files with Content-Type: text/javascript.
const express = require('express');
const path = require('path');
const app = express();
// Explicitly serve static folder with correct MIME types
app.use(express.static(path.join(__dirname, 'public'), {
setHeaders: (res, filePath) => {
if (filePath.endsWith('.js')) {
res.setHeader('Content-Type', 'text/javascript');
}
}
}));How to verify the fix: Network header inspection confirms Content-Type: text/javascript or application/javascript.
14. Broken Minification or Build Bundling Differences
What happens: JavaScript runs without issues on local development environments (localhost), but fails instantly with mangled stack traces in staging or production builds.
Why it happens: Minifiers (such as Terser or Esbuild) mangle variable/function names or dead-code elimination algorithms strip code reliant on side-effects or string-matched name references.
How to diagnose it: Enable production Source Maps temporarily, or inspect the minified code causing errors in the Sources tab.
How to fix it: Ensure production build settings preserve necessary function/class names if your runtime code depends on constructor.name string checks. Verify build transpilation settings target supported ECMAScript runtime environments.
// Relies on function class names that get mangled during minification
if (entity.constructor.name === "UserAccount") {
// Logic fails when minified to `class e{}` where name becomes "e"
processUser(entity);
}// Explicit type identifier safe from minifier mangling
class UserAccount {
static type = "UserAccount";
}
if (entity.constructor.type === UserAccount.type) {
processUser(entity);
}How to verify the fix: Running npm run build and serving production static outputs locally (npx serve dist) executes without error.
15. Incorrect "this" Binding in Event Handlers and Callbacks
What happens: Accessing this.property inside an event listener callback returns undefined or references the wrong object context (e.g., pointing to the Window or HTML Element instead of the parent Class).
Why it happens: Standard function declarations create their own dynamic this context when invoked. When passed as callbacks, this changes based on who invokes the callback.
How to diagnose it: Add console.log(this) as the first line in your target callback function to check its actual execution context.
How to fix it: Use ES6 Arrow Functions (which inherit lexical this from parent scope) or explicitly bind function instances using .bind(this).
class Counter {
constructor() {
this.count = 0;
// Standard function binds `this` to HTML button instance, NOT Counter class
document.getElementById('inc-btn')?.addEventListener('click', function() {
this.count++; // Fails: sets `button.count` instead of `Counter.count`
});
}
}class Counter {
constructor() {
this.count = 0;
// Arrow function preserves lexical `this` from class scope
document.getElementById('inc-btn')?.addEventListener('click', () => {
this.count++;
console.log(this.count); // Works correctly
});
}
}How to verify the fix: Logging this inside class event callbacks outputs the instanced Class object rather than DOM elements or Window.
How to Debug JavaScript Using Browser DevTools
Browser DevTools are your primary weapon for isolating JavaScript issues. Master these four key panels:
1. The Console Panel
The Console logs uncaught errors, warnings, and manual log statements.
- Filter by Severity: Check
Errorsto isolate blocking runtime failures. - Preserve Log: Enable
Preserve Login settings to keep console messages from wiping out during page redirects.
2. The Network Panel
Inspect script downloads and external API network calls.
- Filter Statuses: Red network lines represent failed asset retrievals or rejected HTTP API calls (4xx/5xx).
- Payload Inspection: Inspect sent HTTP Headers, URL params, Request Payload JSON, and raw Server Responses.
3. The Sources Panel & Breakpoints
Set visual conditional breakpoints instead of cluttering code with console.log().
- Line Breakpoints: Click line numbers in source files to pause execution and hover over variables to inspect live values.
- Call Stack Panel: View the execution tree leading up to a paused state to see which function invoked the current scope.
4. The Elements Panel
Inspect live DOM structure and bound event listeners.
- Event Listeners Tab: Select any HTML element on page, then expand the Event Listeners sub-tab in the right sidebar to confirm attached handlers.
Troubleshooting Decision Tree
Follow this decision flowchart to quickly locate root causes based on behavior:
[JavaScript Issue Detected]
│
├── 1. Does the script fail to load or throw an initial file error?
│ ├── YES ──► Check URL Paths | Check Network Status (404/500) | Check MIME Type | Check CSP Headers
│ └── NO ───► Go to Step 2
│
├── 2. Are there red error messages in the Console?
│ ├── YES ──► SyntaxError? Fix code formatting at line.
│ │ ReferenceError? Check variable declaration & scoping.
│ │ TypeError? Check for null/undefined objects or invalid functions.
│ └── NO ───► Go to Step 3
│
├── 3. Does the page load cleanly, but user interactions (clicks/forms) do nothing?
│ ├── YES ──► Check script execution timing (defer/DOMContentLoaded).
│ │ Verify DOM query selectors match HTML markup.
│ │ Check event listener registration logic.
│ └── NO ───► Go to Step 4
│
├── 4. Are data calls, form submissions, or external requests failing?
│ ├── YES ──► Check Network tab status | Verify CORS configuration.
│ │ Verify async/await usage | Verify response.ok status handling.
│ └── NO ───► Go to Step 5
│
└── 5. Works locally on dev server, but fails post-deployment?
└── YES ──► Clear asset caches | Check build bundling output.
Check environment variable availability | Fix absolute vs relative paths.Common JavaScript Errors Reference
| Error Name | Technical Meaning | Primary Root Cause | First Thing to Check |
|---|---|---|---|
ReferenceError: X is not defined |
Scope variable lookup failed. | Typo in variable name or variable accessed before declaration scope. | Variable name spellings and source scope boundaries. |
TypeError: Cannot read properties of undefined/null |
Attempted property/method access on non-object. | Uninitialized dynamic data, failed query selection, or unawaited Promise. | Log target variable immediately prior to failing line. |
SyntaxError: Unexpected token |
JS engine failed code parsing. | Unclosed strings, missing syntax brackets, commas, or unparsed JSX/ESNext. | DevTools line number pointer showing syntax failure. |
TypeError: X is not a function |
Tried calling a variable as a function that isn't one. | Calling missing method names or broken object exports. | Run typeof obj.method to verify target type before calling. |
Failed to fetch |
Low-level network call abort. | Broken internet connection, CORS block, or target server offline/unreachable. | Network tab error state and server CORS response headers. |
Uncaught (in promise) |
An async operation failed without handling. | Missing .catch() block or un-caught try/catch around await. |
Wrap async code inside standard try/catch structures. |
RangeError: Maximum call stack size exceeded |
Stack overflow execution block. | Infinite recursion loop or unbounded recursive loop conditions. | Base exit termination conditions inside recursive functions. |
Common Mistakes and Prevention Best Practices
Common Mistakes to Avoid
- Debugging Blindly Without Console: Modifying code logic before reading the explicit error message and line number in DevTools.
- Changing Multiple Variables Simultaneously: Modifying multiple files concurrently introduces secondary syntax and logic errors.
- Ignoring the Top Stack Trace Error: A cascade of errors is usually triggered by the first error. Always fix the top error first.
- Assuming API Calls Always Succeed: Writing code that assumes API fetches will return 200 payloads without error handling wrappers.
- Testing Exclusively on Localhost: Local environments bypass CORS policies, CDN asset caches, and minification steps.
Best Practices for Prevention
- Use ESLint and Prettier: Catch missing brackets, unused variables, and syntax errors directly in your editor before running code.
- Adopt TypeScript: Static type-checking flags
null/undefinedbugs, bad object property access, and interface mismatches during development. - Implement Defensive Error Handling: Always wrap network calls and parsing logic in
try/catchblocks. - Automate Testing: Write unit tests (via Vitest/Jest) for critical logic, and end-to-end integration tests (via Playwright/Cypress).
- Monitor Production Errors: Use error tracking platforms (like Sentry, LogRocket, or Datadog) to capture runtime exceptions.
How to Verify Your JavaScript Is Working Checklist
- DevTools console runs clean with zero red uncaught error messages on page load.
- Network panel confirms all static
.jsfiles return200 OKor304 Not Modified. - Event listeners trigger predictably upon user interactions (clicks, keypresses, inputs).
- Asynchronous API calls return valid data payloads and safely handle failure states.
- DOM manipulation functions update target elements correctly.
- Production build scripts run cleanly without syntax or bundling errors.
Technical & Software Development Agency Services
For companies requiring full-cycle software development, platform architecture, or technical debt remediation, specialized agency support accelerates delivery while enforcing engineering standards.
| Service Category | Operational Scope | Primary Deliverables | Target Architecture |
|---|---|---|---|
| Enterprise Web Development | Custom frontend/backend web application development, platform modernization, technical auditing. | High-throughput web platforms, optimized SPA/SSR architectures, secure REST/GraphQL integrations. | Next.js, React, Node.js, TypeScript, Cloud Native, Go. |
| MVP Development & Acceleration | Rapid prototyping, core feature deployment, scalable infrastructure setup. | Production-ready Minimum Viable Products, automated deployment pipelines, analytics integration. | AMDSNK MVP Development Platform, Serverless, PostgreSQL, Tailwind. |
| Codebase Audit & Debugging | Full technical reviews, performance profiling, security vulnerability assessments. | Comprehensive technical debt reports, runtime exception resolution, asset optimization. | Web Vitals Optimization, CSP Compliance, CI/CD Auditing. |
Need Expert Software Development & MVP Delivery?
Transform your product requirements into a production-ready web application with high engineering standards.
Frequently Asked Questions (FAQ)
Why is my JavaScript not working in HTML?
Your script tag might be running before the DOM parses, or the script path is incorrect. Ensure external scripts use defer (e.g., <script src="app.js" defer></script>), or place the script tag immediately before the closing </body> tag.
Why is my JavaScript file not loading?
A file fails to load if the relative file path is wrong, leading to a 404 Not Found network error. Open DevTools > Network tab, filter by JS, and reload the page to inspect the HTTP status code of your script file.
Why does my JavaScript work in the console but not in my page?
Console commands run against an already fully parsed DOM. Your page script might be running before elements exist in the DOM tree. Wrap your script logic inside a DOMContentLoaded event listener or use the defer script attribute.
Why is my JavaScript function not running?
A function won't execute if it is never invoked, if a syntax error earlier in the file halts parsing, or if an event listener targeting the function was bound to a non-existent DOM element.
Why is onclick or event listener not working in JavaScript?
If binding via JS (element.addEventListener), the target element might not exist in the DOM when the listener attaches. Use event delegation on a parent node or verify the element isn't returning null when queried.
Why is my JavaScript working locally but not in production?
Common deployment issues include hardcoded local server API URLs, missing environment variables, aggressive browser asset caching, strict server Content Security Policies (CSP), or minification mangling.
How do I know if my JavaScript file is loaded successfully?
Open DevTools > Sources panel, locate your file, and verify its contents. You can also add console.log("Loaded successfully"); as the very first line of your script file.
How do I debug JavaScript errors on mobile browsers?
Connect your mobile device via USB to a desktop computer and use Remote Debugging features (Chrome Remote Debugging for Android or Safari Web Inspector for iOS) to inspect mobile console output and network logs live.
