The author built a Chrome extension for claude.ai to display a live token count and session total, addressing the lack of a context limit indicator. The extension utilizes Manifest V3, requiring the use of service workers for background scripts. The author used a MutationObserver to address the dynamic nature of the claude.ai interface. To find the input element, attribute-based selectors are used rather than class names. The extension approximates token counts using a words-times-1.3 formula. A badge is injected into the webpage and updates on input and keyup events. The manifest file configures the extension, granting permissions. A surprising challenge was tracking message submissions to calculate session token totals. Enter key presses and send button clicks are observed to determine when a message is sent.
dev.to
dev.to
