ChatGPT SMILES

Manifest V3 Chrome extension scaffold for rendering rendered markdown SMILES code blocks as inline molecular structures.

What It Does

The extension scans pages for rendered code blocks marked as SMILES, such as:

```smiles
C1=CC=CC=C1
```

When it finds one, it preserves the original code block and appends a rendered SVG structure below it using smiles-drawer.

Current Support

• Rendered markdown/code blocks only
• Selectors:
  • pre code.language-smiles
  • pre code[class*="language-smiles"]
  • code.language-smiles
  • code[class*="language-smiles"]
• Dynamic page updates via MutationObserver
• Settings stored in chrome.storage.sync

Current Non-Goals

• Parsing raw text nodes for literal triple-backtick fences
• Site-specific DOM adapters
• Background service worker features
• Popup-triggered page actions
• Chrome Web Store publishing flow

Install

npm install

Development

npm run dev

This runs a watch build into dist/.

Build

npm run build

Verification

npm run typecheck
npm run test
npm run build

Load In Chrome

1. Run npm run build
2. Open chrome://extensions
3. Enable Developer mode
4. Click Load unpacked
5. Select the repo's dist/ directory

Settings

The options page stores these values in chrome.storage.sync:

• enabled
• theme: light | dark | auto
• size: small | medium | large

The popup shows the saved state and links to the options page.

Known Limitations

• Pages that strip the language-smiles class or otherwise hide the markdown language hint will not match the default detector.
• The scaffold appends rendered output below the source block instead of replacing site-specific markdown rendering.
• Invalid SMILES input is surfaced as a muted render failure note and leaves the source untouched.