tattletab for developers

Send a user one link and get back an exact report of their browser: about 2,000 feature checks, settings, screen, fonts, GPU, Baseline status and what blocks their requests. No account, no install.

Ask a user for a report

Send this link, with your name or ticket after for=:

https://tattletab.net/?for=Acme+support+%2312

With JavaScript on, this box builds the link for you and shows a QR code to scan with a phone.

What you get back

  • A link or a file. The user uploads the report (kept 90 days, readable by anyone with the link) or downloads it. You open a file by dropping it onto tattletab.net.
  • Worth noticing. The report starts with what most often explains a bug only some people see: an outdated browser, an in-app browser, a translated page, zoom, forced colours, blocked requests or cookies, a private window, JavaScript JIT switched off, storage that fails, a wrong clock.
  • A summary for your issue tracker. "Copy for bug report" puts Markdown on the clipboard: browser and how far behind it is, device, settings, what's worth noticing, the features your site needs, Baseline status, missing syntax, the user's description and the link.
  • Everything else in the report: request headers, client hints, screen and layout, permissions, storage and workers that really work, autoplay, push, built-in AI models, third-party cookies, WebRTC, codecs, fonts, emoji, keyboard layout, date and number formats, and support for every web API, CSS property and HTML element in MDN's data.

The user sees every value first and can hide any of them; hidden values stay hidden everywhere.

Check the features your site needs

Add needs= to the link with the features your site relies on. The report then starts with "11 of 12 supported, missing: View Transitions", and the list is saved in the report.

https://tattletab.net/?for=Acme&needs=view-transitions,container-queries,api.Navigator.share

Use web-features IDs (view-transitions, has, dialog) or browser-compat-data keys for single APIs and members (api.Navigator.share, css.properties.container, javascript.builtins.Array.findLast). Up to 100, separated by commas.

Include your own page

A report from tattletab.net can't see your site. Add the snippet and a link:

<script src="https://tattletab.net/snippet.js" async></script>
<a href="https://tattletab.net/" data-tattletab="Acme support"
   data-tattletab-needs="view-transitions,api.Navigator.share">Report a problem</a>

From the moment it loads, the snippet keeps your page's JavaScript errors, unhandled promise rejections, Content Security Policy violations and files that failed to load (at most 20 each), and measures Core Web Vitals (LCP, CLS, INP); load it early to catch more. When the user clicks the link, the report also covers your page: those errors, whether cookies and storage work there, quirks mode, iframes, zoom, page load timing and traces of extensions that change it. The data travels after # in the URL, which browsers never send to a server; query strings are left out because they can hold tokens.

Add your own fields (at most 20 short values, shown to the user before sharing) or open the report from code:

tattletab.set({ appVersion: "2.4.1", plan: "pro" });
tattletab.report({ for: "Acme support", needs: ["container-queries"] });

tattletab.context() returns what would be sent. The snippet is plain ES5, about 10 KB, with no dependencies, and sends nothing on its own.

Add it to your issue template

A GitHub issue form (.github/ISSUE_TEMPLATE/bug.yml) that asks for the link:

name: Bug report
description: Something doesn't work
body:
  - type: textarea
    attributes:
      label: What happened?
    validations:
      required: true
  - type: input
    attributes:
      label: Browser report
      description: >-
        Open https://tattletab.net/?for=Our+project, press "Upload and get link",
        and paste the link here. You can hide anything before sharing.
      placeholder: https://tattletab.net/r/...

Compare two browsers

tattletab.net/?compare lists only the differences between two reports, for example a browser where the bug happens and one where it doesn't. Link two uploaded reports directly:

https://tattletab.net/?compare=first-report-id,second-report-id

Options

?for=NameShows the user who is asking and saves it in the report (up to 200 characters).
?needs=a,bFeatures your site needs, checked at the top of the report and saved in it.
?lang=deInterface language: en, de, fr or es. Without it, the browser's language is used.
?compare, ?compare=a,bOpens the comparison, optionally with two report IDs.
#site=...Set by the snippet: context from your page. Not meant to be written by hand.

Read reports from code

GET https://tattletab.net/api/reports/{id} returns the report as JSON (format tattletab/v1: createdAt, optional context with requestedBy, note and needs, and entries with id, label, value, status and sensitivity). Lookups are limited to 60 per minute per address. Reports expire after 90 days; only the uploader's browser can delete one early.

The format is described as a JSON Schema at https://tattletab.net/schema.json, for validating reports or generating types.

Languages: English · Deutsch · Français · Español