v6.0.0-beta.13

New

• iframe support, closes #353
• components: loading indicator
• components: multiple console bindings, closes #1416
• highlighter: auto update position/size (30fps)
• api: add type to edit custom inspector state
• timeline: new colors and selected styles
• timeline: compute group overlap based on visible positions
• timeline: event list keyboard nav
• timeline: zoom buttons
• timeline: scroll move buttons

Fixed

• scroll to top on inspector selection change
• timeline: mouse selection when scrolled down
• async getAppRecord, closes #1459
• better root instance, closes #1376
• check for root instance, fixes #1464

v6.0.0-beta.12

New

• vue2: devtools.hide option support, closes #1444
• backend: on page config with support for VUE_DEVTOOLS_CONFIG.openInEditorHost, closes #1440
• highlighter: new style + size display
• highlighter: improved label position and overflow handling
• components: scroll into component button
• components: improved name settings
• components: keyboard navigation, closes #1430
• components: basic render code view, closes #535
• components: log HTMLELement to console
• inspector: 'Go home' button on the inspector not found page
• inspector: improved HTMLElement display + attributes
• header: link to docs
• header: improved 'more' menu with new style and icons
• reorganized settings
• custom inspector: keybord navigation
• api: custom state actions
• api: custom inspector actions
• api: selectInspectorNode

Fixed

• inspector: tree horitonal scroll, related to #1126
• inspector: display tooltip on abstract field key
• instanceMap of null, fixes #1446
• highlighter: prevent label overflow, fixes #1361
• components: guess vue3 anonymous components name, fixes #1311
• components: better tag colors
• components: state keys order
• vue2: vuex getters state grouped by module, fixes #1413
• plugin: dark bg
• header: more menu overflow on small viewport height
• remove app on unmount, fixes #1455
• vue3: computed/inject from mixins/extends (vue-next#3566)

v6.0.0-beta.11

New

• Performance monitoring
  • Component tree tag
  • Performance Timeline layer with flamechart
  • Option to disable it in the Global Settings
• Inspector: display error stack trace
• 'log error to console' button
• timeline: group info in inspector
• timeline: vertical mouse wheel scroll on canvas
• inspector api: tree node tag tooltip support
• timeline api: new timeline layer options

Fixed

• components: only attempt standard edit if type is data, props, setup or computed
• components: wrong app context in some hooks
• vue2: handling un-namespaced vuex module (#1442)
• vue2: handle error in getters
• vue2: improved error handling in computed
• vue3: handle errors in component fields
• vue3: component instance serialization
• timeline: colors if hexa starts with 0x00
• timeline: update layers positions issues
• timeline: event not found
• timeline: early events should not be cleared
• timeline: overlapping groups
• timeline: overhauled group collision checks
• timeline: infinite loop if no groups on layer
• timeline: improve scrollbar when small
• timeline: layers resetting too much causing glitches
• timeline: leak when clearing events
• timeline: error on event without PIXI container yet
• timeline: batch event position updates in microtask
• timeline: overhauled event mouse selection
• timeline: camera not updating on mounted
• timeline: leak on unmount

v6.0.0-beta.10

The devtools frontend is now almost entirely migrated to Typescript 🔥

New

• header: new Inspector/Timeline switch ('Plugins' moved to the 'more' menu on the right)
• timeline: selectable layers
• api: scope plugin hooks to associated app by default (disable with disableAppScope in plugin setup)
• api: add app to payload to hooks
• api: edit custom component fields

Fixed

• improved dark theme border colors
• other small fixes (thanks Typescript!)

Maintenance

• Migrated the frontend to Typescript
• Upgraded to ESLint 7

v6.0.0-beta.9

Fixed

• remove warnings in production, closes #1415
• EmptyPane: align text center
• components tree flashing
• component: edit comp with no setup, closes #1427
• switch to for...of, closes #1422
• autoscroll only when selected changes, closes #1429
• don't use localStorage, closes #1424
• check if event has bounds, closes #1398
• components: sort by position
• electron: no scrollbars, closes #1336

Improved

• timeline: disable screenshots if not supported
• components: support multi prop type, closes #1414

v6.0.0-beta.8

New

• Plugin permissions
• Vue 2 support (with vue-router and vuex)
• implements copy path method (#1378)
• api: add utilities API (#1379)
• api: custom inspector noSelectionText option
• custom inspector: filter state
• devtools: { hide: true } component option

Improved

• UX refinements
• Selected component auto expand parents (even between page refreshes)
• Vue3: edit computed with setters
• improved inspector autoscroll
• inspector: auto expand with 12 subfields from 6

Fixed

• api: editable should be optional
• api: missing app in inspectTimelineEvent hook payload
• api: omit type prop for CustomInspectorState
• components: scroll into selected node
• components: unhighlight when switching tab
• components: filter for updates
• components: nested data edit
• green colors reworked
• plugins: dark background
• plugins: colors & rounded consistency
• timeline: error when no appRecord found (#1345)
• timeline: select dropdown max width
• timeline: move plugin icon next after the label
• custom inspector: tag height
• custom inspector: losing selection on filter tree
• custom inspector: save/restore selected node
• vue3: utils backend injections error
• vue3: improved keep-alive support

Contributing

• Migrated to tailwind JIT
• Migrated to Webpack 5

v6.0.0-beta.7

Fixed

• timeline: screenshots on Firefox
• api: notifyComponentUpdate arg is optional

New

• api: new visitComponentTree hook called for each node in the tree
• api: plugin custom logo

v6.0.0-beta.6

Fixed

• data edit not working, closes #1358
• Firefox wheel event fixes
• Firefox would hang when switching devtools tab when timeline is displayed, closes #1357

v6.0.0-beta.5

Hotfix

• Components: expanding the tree not working.

v6.0.0-beta.4

See the changelog.

Fixed

• Security: Toast vulnerable to XSS attack
• Tooltips showing HTML
• Edit fields text color and input z-index
• Improved component tree handling
• Component tag position
• Timeline: use canvas fallback when WebGL isn't available
• Added error handler on API hooks
• Component tree fixes
• Timeline styling fixes

Changed

• API: walkComponentTree payload is now always an array of nodes

New

• Suspense support
• Component Attributes
• Component Provide/Inject
• (Single) Refs
• New icons
• See plugin source for: - timeline layer; - custom inspector; - component state type
• Plugins tab
• Improved timeline layers selector dropdown