chore: small changes

.prettierrc.json

@@ -0,0 +1,5 @@
+{
+  "singleQuote": true,
+  "tabWidth": 2,
+  "semi": false
+}

build/webpack.analyser.js

@@ -1,5 +1,5 @@
-const BundleAnalyzerPlugin = require('webpack-bundle-analyzer')
-  .BundleAnalyzerPlugin
+const BundleAnalyzerPlugin =
+  require('webpack-bundle-analyzer').BundleAnalyzerPlugin
 
 exports = require('./webpack.prod')
 

package.json

@@ -71,7 +71,7 @@
     "luna-notification": "^0.1.4",
     "luna-object-viewer": "^0.2.4",
     "luna-setting": "^0.4.1",
-    "luna-tab": "^0.1.2",
+    "luna-tab": "^0.1.3",
     "luna-text-viewer": "^0.2.1",
     "node-sass": "^7.0.1",
     "postcss-clean": "^1.1.0",

prettier.config.js

@@ -1,5 +0,0 @@
-module.exports = {
-  singleQuote: true,
-  tabWidth: 2,
-  semi: false,
-}

src/DevTools/DevTools.js

@@ -7,6 +7,7 @@ import keys from 'licia/keys'
 import last from 'licia/last'
 import each from 'licia/each'
 import isNum from 'licia/isNum'
+import nextTick from 'licia/nextTick'
 import $ from 'licia/$'
 import toNum from 'licia/toNum'
 import isDarkMode from 'licia/isDarkMode'
@@ -234,7 +235,7 @@ export default class DevTools extends Emitter {
     this._tab.destroy()
     this._$el.remove()
     window.removeEventListener('resize', this._checkSafeArea)
-    emitter.off(emitter.SCALE, this._resetTabHeight)
+    emitter.off(emitter.SCALE, this._updateTabHeight)
   }
   _checkSafeArea = () => {
     const { $container } = this
@@ -290,8 +291,11 @@ export default class DevTools extends Emitter {
     })
     this._tab.on('select', (id) => this.showTool(id))
   }
-  _resetTabHeight = (scale) => {
+  _updateTabHeight = (scale) => {
     this._tab.setOption('height', 40 * scale)
+    nextTick(() => {
+      this._tab.updateSlider()
+    })
   }
   _initNotification() {
     this._notification = new LunaNotification(
@@ -360,6 +364,6 @@ export default class DevTools extends Emitter {
     this.$container.on('click', (e) => e.stopPropagation())
     window.addEventListener('resize', this._checkSafeArea)
 
-    emitter.on(emitter.SCALE, this._resetTabHeight)
+    emitter.on(emitter.SCALE, this._updateTabHeight)
   }
 }

src/Network/Network.js

@@ -36,8 +36,8 @@ export default class Network extends Tool {
     this._container = container
     this._initTpl()
     this._detail = new Detail(this._$detail, container)
-    this._splitMeidaQuery = new MediaQuery('screen and (min-width: 680px)')
-    this._splitMode = this._splitMeidaQuery.isMatch()
+    this._splitMediaQuery = new MediaQuery('screen and (min-width: 680px)')
+    this._splitMode = this._splitMediaQuery.isMatch()
     this._requestDataGrid = new LunaDataGrid(this._$requests.get(0), {
       columns: [
         {
@@ -298,11 +298,11 @@ export default class Network extends Tool {
       throttle(() => this._updateDataGridHeight(), 15)
     )
 
-    this._splitMeidaQuery.on('match', () => {
+    this._splitMediaQuery.on('match', () => {
       this._detail.hide()
       this._splitMode = true
     })
-    this._splitMeidaQuery.on('unmatch', () => {
+    this._splitMediaQuery.on('unmatch', () => {
       this._detail.hide()
       this._splitMode = false
     })
@@ -325,7 +325,7 @@ export default class Network extends Tool {
 
     this._resizeSensor.destroy()
     evalCss.remove(this._style)
-    this._splitMeidaQuery.removeAllListeners()
+    this._splitMediaQuery.removeAllListeners()
 
     const network = chobitsu.domain('Network')
     network.off('requestWillBeSent', this._reqWillBeSent)

src/Resources/Resources.js

@@ -64,6 +64,8 @@ export default class Resources extends Tool {
   destroy() {
     super.destroy()
 
+    this._localStorage.destroy()
+    this._sessionStorage.destroy()
     this._disableObserver()
     evalCss.remove(this._style)
     this._rmCfg()

src/Resources/Storage.js

@@ -7,6 +7,7 @@ import LunaDataGrid from 'luna-data-grid'
 import isNull from 'licia/isNull'
 import trim from 'licia/trim'
 import copy from 'licia/copy'
+import emitter from '../lib/emitter'
 import { safeStorage, classPrefix as c } from '../lib/util'
 
 export default class Storage {
@@ -38,6 +39,9 @@ export default class Storage {
 
     this._bindEvent()
   }
+  destroy() {
+    emitter.off(emitter.SCALE, this._updateGridHeight)
+  }
   refresh() {
     const dataGrid = this._dataGrid
 
@@ -139,6 +143,12 @@ export default class Storage {
       ? localStorage.getItem(key)
       : sessionStorage.getItem(key)
   }
+  _updateGridHeight = (scale) => {
+    this._dataGrid.setOption({
+      minHeight: 60 * scale,
+      maxHeight: 223 * scale,
+    })
+  }
   _bindEvent() {
     const type = this._type
     const devtools = this._devtools
@@ -213,5 +223,7 @@ export default class Storage {
         this._selectedItem = null
         this._updateButtons()
       })
+
+    emitter.on(emitter.SCALE, this._updateGridHeight)
   }
 }