# All versions since 0.20.0

> True HMR for Lit components, CSS delivery helpers, and a DevTools timeline for Vite.

Find a version

[All versions](/reference/changelog/)

## [0.20.0](/reference/changelog/version/0-20-0/)

Oct 18, 2026

The plugin now runs in Astro. `lit()` server-renders and hydrates Lit components with no other renderer, and `litDevtools()` brings hot patching and the Lit panel, opened from Astro’s dev toolbar. The Components tab reads hydration as a state and stops labelling other libraries’ elements. The DevTools now warn when the Lit Inspector extension and the plugin share a page, and both work there. Nothing needs action to upgrade.

### Added

* **The plugin runs in Astro, with the Lit panel in the dev toolbar.** Add `litDevtools()` from `@oddsquad/vite-plugin-lit/astro` to your integrations: Lit components hot-patch in place, hydrated or not, and the Lit logo in Astro’s dev toolbar opens the panel on the page you are on. `LIT_PLUGIN_TIMELINE=false` turns the panel off, and the `timeline` option wins over it.
* **Lit components render and hydrate in Astro with no other renderer.** `lit()` from `@oddsquad/vite-plugin-lit/astro` server-renders Lit components, hydrates them with their array and object props, keeps a `defer-hydration` you wrote until you remove it, and needs no hydrate imports in your pages. Components nested in another’s shadow root hydrate after a view transition too.
* **Resize the Lit window in Astro’s dev toolbar.** Drag the grip in its top corner to make it bigger or smaller; the size sticks across page loads, and a double click on the grip resets it. The window lines up with where the toolbar is docked.
* **The DevTools warn when two runtimes share a page.** With the Lit Inspector extension enabled on a dev server that already runs the plugin, the console and the Components tab now say that two runtimes are loaded and that the extension should be off for that site, instead of the picker silently doing nothing.

### Changed

* **Hydration state reads as a state.** A server-rendered component that has hydrated is now marked *hydrated* instead of *SSR*, and *deferred*, *not hydrated* and *hydrated* show as pills in the Components tree and details, with a drop icon that is empty until the element hydrates and filled once it has.
* **Custom elements from other libraries sit in the tree unmarked.** The muted *not Lit* chip is gone from their rows and the details head, so wrappers like Astro’s islands no longer crowd the tree with labels; the details pane still says why they have no properties.
* **A component that never upgraded shows one chip, not two.** One the server rendered was marked both *not upgraded* and *not hydrated*, as if hydration were still coming; it now carries only *not upgraded*, whose tooltip says it still shows the HTML the server sent.

### Fixed

* **The Lit Inspector extension works on a dev server that runs the plugin.** Enabled for such a site, Pick did nothing and threw in the console, and Vite DevTools lost the page. The extension’s runtime now serves the page and the plugin’s shares it, so both panels show the tree and Pick works from either.
* **The link printed with the DevTools code opens the Lit panel.** Without the Vite DevTools hub, the `#devframe_otp` link in the terminal opened your app instead of the panel at `/__lit/`, so you had to type the code; it now opens the panel, approved.
* **The Lit panel connects on StackBlitz without Vite DevTools.** In a WebContainer the panel the plugin serves at `/__lit/` used to be refused by its own socket and never show the page; it now admits StackBlitz’s origins.

## [0.20.1](/reference/changelog/version/0-20-1/)

Oct 19, 2026

A patch of fixes: the Lit tab in Firefox DevTools works again after opening blank since 0.19.0, server-rendered elements hydrate with the source overlay on, and closing a panel tab always clears what it drew. Nothing needs action to upgrade.

### Fixed

* **The Lit tab works in Firefox DevTools again.** Since 0.19.0 it opened blank in Firefox; it now shows the site’s status and the inspector once the site is enabled.
* **Server-rendered Lit elements hydrate with the source overlay on.** An element whose template renders another custom element no longer re-renders in the browser with a warning about an edit that never happened, in Astro or any other server rendering.
* **Closing a panel tab always clears what it drew on the page.** The anatomy overlay, outline and Live mode no longer outlive a panel tab that closed too fast to say so, or crashed.
* **The panel stops filling the console with warnings.** Opening it no longer prints Web Awesome’s `size="small" is deprecated` warnings, and a panel in a tab of its own, at `/__lit/` or in Firefox’s DevTools, no longer warns that the in-page channel has no handshake targets.

## [0.21.0](/reference/changelog/version/0-21-0/) Latest

Oct 19, 2026

Lit Inspector now opens sources in your editor: on a page a Vite dev server serves, even without the plugin, a component’s **defined** and **rendered** links open the file. Locations read shorter everywhere, by package and version or relative to the project, and a library’s component names the module its manifest gives. The panel also follows sites that swap in a new page body, such as webawesome.com. Nothing needs action to upgrade.

### Added

* **The extension opens sources in your editor on a Vite dev server.** On a page Vite serves, with or without the plugin, the **defined** and **rendered** links open the file in your editor instead of only in Chrome’s Sources panel, and work in Firefox too. They use the plugin’s endpoint when it serves one, else Vite’s own `/__open-in-editor`, under the page’s `base`. When the extension can’t tell where the project is on disk, the bottom of the **Lit** tab says so and offers **Set project folder…** for the site.

### Changed

* **Locations in dependencies name the package.** A component from a package reads as its name, version and path inside it, such as `@awesome.me/webawesome 3.14.0 › dist/chunks/chunk.js:11`, instead of five lines of pnpm store path; the full path is in the tooltip.
* **A package’s component names its module.** When the package ships a Custom Elements Manifest, **defined** reads as the module and class it names, such as `components/card/card.js (WaCard)`, instead of a bundler chunk. That holds in the Vite panel and, for a manifest read from the site, in the extension.
* **Project files read relative to the project.** A location given as an absolute path, such as Astro’s for an element in `.astro` markup, reads `src/pages/basics.astro:26`, in the Vite panel and in the extension on a Vite dev server; the full path is in the tooltip.

### Fixed

* **The panel follows sites that swap in a new page body.** On a site that navigates with Turbo Drive, such as webawesome.com, the Components tree updates as you follow links, and the hover outline, update flashes and element picker keep working.
* **Lit components with a closed shadow root show their children.** The Components tree lists what such a component renders, and Live follows changes inside it, as the anatomy view already did.
* **Elements written in `.astro` markup show where they are rendered.** The **rendered** link, the source overlay and timeline events now point at the `.astro` file and line, where before those elements had no location at all.
* **The extension finds a decorated component on a Vite dev server.** On a page Vite serves without the plugin, **defined** pointed at the compiler’s `decorate` helper instead of the file that declares the class.
