Viewport Meta Checker

WHAT IT DOES Viewport Meta Checker scans the current page for viewport meta tags and performs a comprehensive analysis of mobile responsiveness configuration. It displays the full viewport content attribute and parses each key-value pair: width, initial-scale, maximum-scale, minimum-scale, user-scalable, and viewport-fit. It checks for common issues: missing viewport tag, missing width, invalid width values (not using device-width), missing initial-scale, restrictive maximum-scale values that block zoom, user-scalable disabled, minimum-scale issues, and accessibility problems. Each issue comes with a clear explanation and recommended fix. Perfect for mobile optimization audits, accessibility compliance checks, and ensuring proper zoom behavior across devices. WHERE IT RUNS Any webpage—the script scans the page's head for meta[name="viewport"] tags. No server-side calls, no external dependencies, no site-specific configuration. Works on local files, development environments, production sites, and pages behind authentication. The analysis is entirely client-side using standard DOM APIs. HOW TO USE Install the script and open any page. The panel automatically checks for viewport tags and displays the results. The summary shows the status (Valid, Warnings, or Issues), the viewport content string, and a parsed breakdown of each key-value pair. Each issue is listed with severity (error, warning, or info) and a clear recommendation. Toggle "Show warnings" to include or exclude warning-level issues. Click "Check Now" to re-scan—useful for pages where viewport tags are injected dynamically. Click "Copy Report" to copy the full viewport analysis to your clipboard. Keyboard shortcut: Ctrl+Shift+V to re-scan without opening the panel. TECHNICAL MECHANISM The script scans the page using document.querySelector('meta[name="viewport"]') to find the viewport meta tag. It reads the content attribute and parses it by splitting on commas, trimming each part, and splitting each key-value pair on '='. The parsed values are stored as key-value pairs in a normalized object (keys lowercased, values lowercased). The script then performs a series of checks: existence of the tag, presence of width (and whether it equals 'device-width'), presence of initial-scale (and whether it's between 0.5 and 2.0), presence and value of maximum-scale (flagging if < 1.0 or < 1.5), presence and value of minimum-scale (flagging if > 1.0), presence of user-scalable (flagging if 'no' or '0'), and presence of viewport-fit. It also detects combined restrictions (maximum-scale=1.0 AND user-scalable=no) which completely prevent zoom. Each issue is assigned a severity level: error for critical problems (missing tag, missing width), warning for recommended fixes (missing initial-scale, disabled zoom), and info for additional context (viewport-fit, restrictive scaling). Results are rendered with color-coded indicators and actionable recommendations. THE PANEL The tool runs inside BGPanel, a lightweight UI system built into the BotGentz extension. Drag the panel by its header to reposition it anywhere on screen—it snaps to edges and remembers its position per site. Click the header to collapse the panel into a small bubble; click again to expand. Resize the panel by dragging its bottom-right corner. Press Escape at any time to close the panel. The panel stays out of your way but is always accessible via the extension's toolbar. PLEASE NOTE Requires the free BotGentz browser extension to run—this script does not work standalone. The script reads only the page's meta tags—it does not send data anywhere, does not store page content, and does not access other tabs or browser history. The analysis is based solely on the viewport meta tag content; it does not test actual device rendering or simulate mobile browsers. Some sites use multiple viewport tags—only the first is evaluated per browser behavior. Sites that inject viewport tags via JavaScript may not be detected until after the page has fully rendered; use the "Check Now" button to re-scan after dynamic content loads. The script focuses on viewport meta tag issues and does not verify other mobile-responsive CSS properties (e.g., media queries, flexible layouts). Sites change over time, but this script relies on standard DOM APIs, not site-specific selectors, so it remains robust across most pages.