aljaz/pear-docs
1
0
Fork 0
mirror of https://github.com/aljazceru/pear-docs.git synced 2025-12-18 06:54:22 +01:00
Code Issues Packages Projects Releases Wiki Activity

Do not use $

Browse Source
This commit is contained in:
Tobias Baunbaek
2024-01-26 18:05:39 +01:00
parent 525f97dfe5
commit 3cbd6212c3
1 changed files with 24 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
lib/devtools-inspector.js
View File

@@ -10,7 +10,7 @@ customElements.define('devtools-inspector', class extends HTMLElement {
this.template.innerHTML = ` this.template.innerHTML = `
<div> <div>
<style> <style>
#add-key { #add-key-input {
width: 100%; width: 100%;
} }
@@ -30,7 +30,7 @@ customElements.define('devtools-inspector', class extends HTMLElement {
</ol> </ol>
<div> <div>
<form id="add-key-form"> <form id="add-key-form">
<input id="add-key" type="text" placeholder="Id given when running pear with --inspect"/> <input id="add-key-input" type="text" placeholder="Id given when running pear with --inspect"/>
<p id="add-key-error"></p> <p id="add-key-error"></p>
</form> </form>
</div> </div>
@@ -41,22 +41,22 @@ customElements.define('devtools-inspector', class extends HTMLElement {
this.root = this.attachShadow({ mode: 'open' }) this.root = this.attachShadow({ mode: 'open' })
this.root.appendChild(this.template.content.cloneNode(true)) this.root.appendChild(this.template.content.cloneNode(true))
this.$addKeyForm = this.root.querySelector('#add-key-form') this.addKeyFormElem = this.root.querySelector('#add-key-form')
this.$addKey = this.root.querySelector('#add-key') this.addKeyInputElem = this.root.querySelector('#add-key-input')
this.$addKeyError = this.root.querySelector('#add-key-error') this.addKeyErrorElem = this.root.querySelector('#add-key-error')
this.$apps = this.root.querySelector('#apps') this.appsElem = this.root.querySelector('#apps')
this.$noApps = this.root.querySelector('#no-apps') this.noAppsElem = this.root.querySelector('#no-apps')
this.apps = new Map() this.apps = new Map()
this.$addKeyForm.addEventListener('submit', e => { this.addKeyFormElem.addEventListener('submit', e => {
e.preventDefault() e.preventDefault()
const publicKey = this.$addKey.value const publicKey = this.addKeyInputElem.value
if (publicKey.length === 0) { if (publicKey.length === 0) {
this.$addKeyError.textContent = '' this.addKeyErrorElem.textContent = ''
return return
} }
if (publicKey.length !== 64) { if (publicKey.length !== 64) {
this.$addKeyError.textContent = 'Key needs to be 64 characters long' this.addKeyErrorElem.textContent = 'Key needs to be 64 characters long'
return return
} }
@@ -80,16 +80,16 @@ customElements.define('devtools-inspector', class extends HTMLElement {
this.renderApps() this.renderApps()
}) })
this.$addKey.value = '' this.addKeyInputElem.value = ''
this.$addKeyError.textContent = '' this.addKeyErrorElem.textContent = ''
this.renderApps() this.renderApps()
}) })
const httpServer = http.createServer() const devtoolsHttpServer = http.createServer()
const wsServer = new WebSocketServer({ noServer: true }) const devToolsWsServer = new WebSocketServer({ noServer: true })
httpServer.listen(9229, () => console.log('[httpServer] running on port 9229')) devtoolsHttpServer.listen(9229, () => console.log('[devtoolsHttpServer] running on port 9229'))
httpServer.on('request', (req, res) => { devtoolsHttpServer.on('request', (req, res) => {
if (req.url !== '/json/list') { if (req.url !== '/json/list') {
res.writeHead(404) res.writeHead(404)
res.end() res.end()
@@ -104,7 +104,7 @@ customElements.define('devtools-inspector', class extends HTMLElement {
id: sessionId, id: sessionId,
title: app.title, title: app.title,
type: 'node', type: 'node',
url: app.url, url: `file://${app.url}`,
webSocketDebuggerUrl: `ws://127.0.0.1:9229/${sessionId}` webSocketDebuggerUrl: `ws://127.0.0.1:9229/${sessionId}`
})) }))
@@ -115,16 +115,16 @@ customElements.define('devtools-inspector', class extends HTMLElement {
}) })
res.end(JSON.stringify(targets)) res.end(JSON.stringify(targets))
}) })
httpServer.on('upgrade', (request, socket, head) => { devtoolsHttpServer.on('upgrade', (request, socket, head) => {
console.log(`[httpServer] UPGRADE. url=${request.url}`) console.log(`[devtoolsHttpServer] UPGRADE. url=${request.url}`)
const sessionId = request.url.substr(1) const sessionId = request.url.substr(1)
const sessionIdExists = this.apps.has(sessionId) const sessionIdExists = this.apps.has(sessionId)
if (!sessionIdExists) return socket.destroy() if (!sessionIdExists) return socket.destroy()
wsServer.handleUpgrade(request, socket, head, ws => wsServer.emit('connection', ws, request)) devToolsWsServer.handleUpgrade(request, socket, head, ws => devToolsWsServer.emit('connection', ws, request))
}) })
wsServer.on('connection', (devtoolsSocket, request) => { devToolsWsServer.on('connection', (devtoolsSocket, request) => {
const sessionId = request.url.substr(1) const sessionId = request.url.substr(1)
const app = this.apps.get(sessionId) const app = this.apps.get(sessionId)
if (!app) return devtoolsSocket.destroy() if (!app) return devtoolsSocket.destroy()
@@ -161,9 +161,9 @@ customElements.define('devtools-inspector', class extends HTMLElement {
<div>Connected: ${app.connected ? 'Yes' : 'No'}</div> <div>Connected: ${app.connected ? 'Yes' : 'No'}</div>
</div> </div>
`) `)
this.$apps.innerHTML = content this.appsElem.innerHTML = content
if (this.apps.size > 0) this.$noApps.remove() if (this.apps.size > 0) this.noAppsElem.remove()
} }
load () { load () {