Content Indexing API Test - Online Add to Device's Media Feed
Test the Content Indexing API to add a page to the device's content feed. See how your PWA integrates with the OS.
UD5 Toolkit
See how your content appears in the system launcher
// Inside service worker 'activate' or after page load
const registration = await navigator.serviceWorker.ready;
if ('index' in registration) {
await registration.index.add({
id: 'article-1',
title: 'My Article',
description: 'Short desc',
url: '/article-1',
category: 'article',
icons: [{ src: '/icon.png', sizes: '96x96' }]
});
}
Requires HTTPS, installed PWA, and supported browser.
No content indexed yet. Add your first item!
'index' in registration before using.ServiceWorkerRegistration.index. You must register a service worker and the page must be served over HTTPS.registration.index.delete(id) to remove a specific entry, or clear all with a loop. This demo simulates deletion locally; in a real app you must call the API.Test the Content Indexing API to add a page to the device's content feed. See how your PWA integrates with the OS.
Simulate a PWA receiving shared text, links, and images. Test the Web Share Target API without a server.
Check if the current page can be loaded offline by examining the service worker cache. Developer tool for PWAs.
Check if the browser has captured the beforeinstallprompt event. Understand why your PWA is (or isn't) installable.
Watch for updates to aria‑live regions and log what a screen reader would announce. Debug live regions.
Test the Web Share API by sharing text, links, and files directly from the browser. Check compatibility and see example code.
Test the Fullscreen API: request fullscreen on a colored div, detect changes, and copy the JavaScript boilerplate.
Enter a URL and see its favicon at all standard sizes. Check if it's properly defined. SEO basic check.
Paste multiple HTML snippets (header, footer) and a main content, then combine them into a single preview. Static site helper.
Inject dynamic messages into ARIA live regions and monitor how they trigger screen reader announcements. Debug a11y.
Paste HTML or Markdown to count total words, unique words, heading distribution, and reading time. Content audit helper.
Enter a URL and see a simulated preview of how the link will appear on major social platforms. Check tags.
Break a large XML sitemap into smaller ones under the 50MB/50,000 URL limit. Generates a sitemap index.
Request permission and detect when the user is idle (away from keyboard). See screen lock state. For native‑like apps.
Enter a URL and get a one‑page report of titles, description, headings, image alts, and broken links. All from browser.
Paste any article and get a list of the most relevant keywords using a simple TF‑IDF‑like model. Skip stop words. All local.
Send a test CSP violation report and see the ReportingObserver in action. Understand how monitoring works.
Test how your page loads under slow, 3G, or offline conditions by intercepting fetch and applying delays. No DevTools needed.
Keep a virtual pet alive by feeding, playing, and cleaning. Its state persists in localStorage. Come back or it gets sad.
Analyze text for keyword frequency and density. Highlights over-optimized terms. Perfect for content writers and SEO editors. Entirely browser-based.
Check if a website is globally reachable or experiencing issues. Status code and latency displayed. Quick browser-side test.
Type directly into a contenteditable div with real‑time CSS filters, shadows, and colors. Download as HTML. Fun demo.
Enter a URL and fetch its text/background colors to perform a bulk contrast check. See warnings for WCAG violations.
Enter a URL and fetch its Twitter card meta tags. See a live preview of how the tweet will appear. Debug social sharing.
Quickly estimate your internet connection speed by downloading a small test file. See class and recommendations.
Enter a TV show name and let the tool pick a random season and episode for you to watch. Uses local data for popular shows.
Design a responsive navigation bar with a pure CSS hamburger menu. Customize colors and breakpoints. Copy the code.
Compare font‑display values (block, swap, fallback, optional) on the fly. See how text renders during web font load. Choose the right strategy.
Enter a URL and get a rough client-side performance simulation: request count, DOM size, and potential speed tips. No real Lighthouse.
Paste SVG path data and remove unnecessary precision, normalize commands, and reduce size. Helpful for optimizing inline SVGs. Local tool.