AtodeYomu

AtodeYomu ("あとで読む" in Japanese) is a Chrome extension that augments the built-in Reading List. You can add pages via the context menu and, whenever a saved page is opened, an action button appears in the bottom-right corner to mark it as read or remove it on the spot.

Features

• 📝 Add from the context menu
  Right-click anywhere on a page and choose “Add Page to Reading List” to register it. If the page already exists in the Reading List as read, it is flipped back to unread.
• 👀 Show an action button on unread pages
  When you visit a page that remains unread in the Reading List, a circular button appears at the bottom-right corner of the tab.
• ✅ Mark as read manually or automatically
  Clicking the button sends a mark-as-read request. Scrolling to the bottom triggers the same action automatically and fades the button out.
• 🗑️ Remove entries instantly
  Hovering over the button reveals a delete control that removes the entry from the Reading List with one click.
• 🔄 Stay in sync with Reading List events
  Whenever items are added, updated, or removed, the background service worker notifies open tabs so the UI stays up to date.

How It Works

• dist/manifest.json
  Manifest V3 configuration requesting contextMenus, readingList, and tabs permissions. No popup UI is defined; the action icon is reserved for badge display (clicking it does nothing at the moment).
• src/background.ts
  The service worker creates the context menu, talks to the Reading List API, and pushes messages to tabs. In development mode it shows a DEV badge on the extension icon.
• src/content_scripts.ts + src/ActionButton.svelte
  Inject the floating action button into the page and wire up mark-as-read / remove interactions. Built with Svelte and bundled as an IIFE via Vite.
• src/shared/*
  Houses message type constants, the URL normalizer (strips query and hash), and the i18n wrapper.

Required Permissions

• contextMenus — Add the right-click menu entry.
• readingList — Read and mutate Chrome’s Reading List.
• tabs — Query tabs and send messages to them.

Setup

npm install
npm run build

Build artifacts and the manifest are emitted into dist/. Load the unpacked directory from chrome://extensions/.

Development Workflow

npm run dev

Starts both watchers so the service worker and content scripts rebuild automatically while you develop.

Testing

Run the Vitest suite:

npm run test

License

MIT License