@kudoai/chatgpt.js 3.8.0 → 3.8.2

package/starters/chrome/extension/lib/chatgpt.js

@@ -25,8 +25,8 @@ const chatgpt = {
     selectors: {
         btns: {
             continue: 'button:has(svg[class*=rotate] > path[d^="M4.47189"])',
-            createImage: 'button[data-testid="composer-create-image"]',
-            deepResearch: 'button[data-testid="composer-deep-research"]',
+            createImage: 'button[data-testid=composer-create-image]',
+            deepResearch: 'button[data-testid=composer-deep-research]',
             login: 'button[data-testid*=login]',
             newChat: 'a[href="/"]:has(svg),' // Pencil button (when logged in)
                    + 'button:has([d^="M3.06957"])', // Cycle Arrows button (in temp chat logged out)
@@ -34,10 +34,10 @@ const chatgpt = {
                     // 'Try Again' entry of model selector below msg
                  + 'div[role=menuitem] div:has(svg):has(path[d^="M3.06957"])',
             scroll: 'button:has(> svg > path[d^="M12 21C11.7348"])',
-            search: 'button[data-testid="composer-button-search"]',
-            reason: 'button[data-testid="composer-button-reason"]',
+            search: 'button[data-testid=composer-button-search]',
+            reason: 'button[data-testid=composer-button-reason]',
             send: 'button[data-testid=send-button]',
-            sidebar: 'button[data-testid*=sidebar-button]',
+            sidebar: 'div[style*=-sidebar-width] button[data-testid=close-sidebar-button], div[style*=-sidebar-rail-width] button[aria-controls=stage-slideover-sidebar]',
             stop: 'button[data-testid=stop-button]',
             upload: 'button:has(> svg > path[d^="M12 3C12.5523"])',
             voice: 'button[data-testid*=composer-speech-button]'
@@ -49,9 +49,9 @@ const chatgpt = {
         chatHistory: 'div#history',
         errors: { toast: 'div.toast-root', txt: 'div[class*=text-error]' },
         footer: 'div#thread-bottom-container > div:last-of-type > div, span.text-sm.leading-none',
-        header: 'div#page-header, main div.sticky:first-of-type',
+        header: 'header#page-header',
         links: { newChat: 'nav a[href="/"]', sidebarItem: 'nav a' },
-        sidebar: 'div[class*=sidebar]:has(nav > div#sidebar-header)',
+        sidebar: 'div#stage-slideover-sidebar, div.bg-token-sidebar-surface-primary',
         ssgManifest: 'script[src*="_ssgManifest.js"]'
     },
 
@@ -69,14 +69,14 @@ const chatgpt = {
                     console.log('\n%c🤖 chatgpt.js personas\n',
                         'font-family: sans-serif ; font-size: xxx-large ; font-weight: bold')
                     for (const prompt of data) // list personas
-                        console.log(`%c${ prompt.title }`, 'font-family: monospace ; font-size: larger ;')
+                        console.log(`%c${prompt.title}`, 'font-family: monospace ; font-size: larger ;')
                     return resolve()
                 }
                 const selectedPrompt = data.find(obj => obj.title.toLowerCase() == persona.toLowerCase())
                 if (!selectedPrompt)
-                    return reject(`🤖 chatgpt.js >> Persona '${ persona }' was not found!`)
+                    return reject(`🤖 chatgpt.js >> Persona '${persona}' was not found!`)
                 chatgpt.send(selectedPrompt.prompt, 'click')
-                console.info(`Loading ${ persona } persona...`)
+                console.info(`Loading ${persona} persona...`)
                 chatgpt.isIdle().then(() => console.info('Persona activated!'))
                 return resolve()
             }
@@ -128,15 +128,16 @@ const chatgpt = {
             drag: {
                 mousedown(event) { // find modal, update styles, attach listeners, init XY offsets
                     if (event.button != 0) return // prevent non-left-click drag
-                    if (getComputedStyle(event.target).cursor == 'pointer') return // prevent drag on interactive elems
+                    if (!/auto|default/.test(getComputedStyle(event.target).cursor))
+                        return // prevent drag on interactive elems
                     chatgpt.draggingModal = event.currentTarget
                     event.preventDefault() // prevent sub-elems like icons being draggable
                     Object.assign(chatgpt.draggingModal.style, {
                         transition: '0.1s', willChange: 'transform', transform: 'scale(1.05)' })
-                    document.body.style.cursor = 'grabbing'; // update cursor
-                    [...chatgpt.draggingModal.children] // prevent hover FX if drag lags behind cursor
-                        .forEach(child => child.style.pointerEvents = 'none');
-                    ['mousemove', 'mouseup'].forEach(eventType => // add listeners
+                    document.body.style.cursor = 'grabbing' // update cursor
+                    ;[...chatgpt.draggingModal.children] // prevent hover FX if drag lags behind cursor
+                        .forEach(child => child.style.pointerEvents = 'none')
+                    ;['mousemove', 'mouseup'].forEach(eventType => // add listeners
                         document.addEventListener(eventType, handlers.drag[eventType]))
                     const draggingModalRect = chatgpt.draggingModal.getBoundingClientRect()
                     handlers.drag.offsetX = event.clientX - draggingModalRect.left +21
@@ -153,10 +154,10 @@ const chatgpt = {
                 mouseup() { // restore styles/pointer events, remove listeners, reset chatgpt.draggingModal
                     Object.assign(chatgpt.draggingModal.style, { // restore styles
                         cursor: 'inherit', transition: 'inherit', willChange: 'auto', transform: 'scale(1)' })
-                    document.body.style.cursor = ''; // restore cursor
-                    [...chatgpt.draggingModal.children] // restore pointer events
-                        .forEach(child => child.style.pointerEvents = '');
-                    ['mousemove', 'mouseup'].forEach(eventType => // remove listeners
+                    document.body.style.cursor = '' // restore cursor
+                    ;[...chatgpt.draggingModal.children] // restore pointer events
+                        .forEach(child => child.style.pointerEvents = '')
+                    ;['mousemove', 'mouseup'].forEach(eventType => // remove listeners
                         document.removeEventListener(eventType, handlers.drag[eventType]))
                     chatgpt.draggingModal = null
                 }
@@ -180,13 +181,13 @@ const chatgpt = {
                 modalStyle.setAttribute('last-updated', thisUpdated.toString())
                 document.head.append(modalStyle)
             }
-            modalStyle.innerText = ( // update prev/new style contents
+            modalStyle.textContent = ( // update prev/new style contents
                 `.chatgpt-modal { /* vars */
-                      --transition: opacity 0.65s cubic-bezier(.165,.84,.44,1), /* for fade-in */
-                                    transform 0.55s cubic-bezier(.165,.84,.44,1) ; /* for move-in */
-                      --bg-transition: background-color 0.25s ease ; /* for bg dim */
-                      --btn-transition: transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out ; /* for smooth zoom */
-                      --btn-shadow: 2px 1px ${ scheme == 'dark' ? '54px #00cfff' : '30px #9cdaff' }}`
+                    --transition: opacity 0.65s cubic-bezier(.165,.84,.44,1), /* for fade-in */
+                                  transform 0.55s cubic-bezier(.165,.84,.44,1) ; /* for move-in */
+                    --bg-transition: background-color 0.25s ease ; /* for bg dim */
+                    --btn-transition: transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out ; /* for smooth zoom */
+                    --btn-shadow: 2px 1px ${ scheme == 'dark' ? '54px #00cfff' : '30px #9cdaff' }}`
 
                 + '.no-mobile-tap-outline { outline: none ; -webkit-tap-highlight-color: transparent }'
 
@@ -196,8 +197,8 @@ const chatgpt = {
                       position: fixed ; top: 0 ; left: 0 ; width: 100% ; height: 100% ; /* expand to full view-port */
                       display: flex ; justify-content: center ; align-items: center ; z-index: 9999 ; /* align */
                       transition: var(--bg-transition) ; /* for bg dim */
-                          -webkit-transition: var(--bg-transition) ; -moz-transition: var(--bg-transition) ;
-                          -o-transition: var(--bg-transition) ; -ms-transition: var(--bg-transition) }`
+                         -webkit-transition: var(--bg-transition) ; -moz-transition: var(--bg-transition) ;
+                         -o-transition: var(--bg-transition) ; -ms-transition: var(--bg-transition) }`
 
                 // Alert styles
                 + `.chatgpt-modal > div {
@@ -211,13 +212,13 @@ const chatgpt = {
                       border: 1px solid ${ scheme == 'dark' ? 'white' : '#b5b5b5' };
                       transform: translateX(-3px) translateY(7px) ; /* offset to move-in from */
                       max-width: 75vw ; word-wrap: break-word ; border-radius: 15px ;
-                      --shadow: 0 30px 60px rgba(0,0,0,0.12) ; box-shadow: var(--shadow) ;
-                          -webkit-box-shadow: var(--shadow) ; -moz-box-shadow: var(--shadow) ;
+                    --shadow: 0 30px 60px rgba(0,0,0,0.12) ; box-shadow: var(--shadow) ;
+                         -webkit-box-shadow: var(--shadow) ; -moz-box-shadow: var(--shadow) ;
                       user-select: none ; -webkit-user-select: none ; -moz-user-select: none ;
-                          -o-user-select: none ; -ms-user-select: none ;
+                         -o-user-select: none ; -ms-user-select: none ;
                       transition: var(--transition) ; /* for fade-in + move-in */
-                          -webkit-transition: var(--transition) ; -moz-transition: var(--transition) ;
-                          -o-transition: var(--transition) ; -ms-transition: var(--transition) }
+                         -webkit-transition: var(--transition) ; -moz-transition: var(--transition) ;
+                         -o-transition: var(--transition) ; -ms-transition: var(--transition) }
                   .chatgpt-modal h2 { font-weight: bold ; font-size: 24px ; margin-bottom: 9px }
                   .chatgpt-modal a { color: ${ scheme == 'dark' ? '#00cfff' : '#1e9ebb' }}
                   .chatgpt-modal a:hover { text-decoration: underline }
@@ -232,13 +233,13 @@ const chatgpt = {
                         display: flex ; justify-content: flex-end ; margin: 20px -5px -3px 0 ;
                         ${ isMobile ? 'flex-direction: column-reverse' : '' }}
                   .chatgpt-modal button {
-                      font-size: 14px ; text-transform: uppercase ;
+                      font-size: 14px ; text-transform: uppercase ; cursor: crosshair ;
                       margin-left: ${ isMobile ? 0 : 10 }px ; padding: ${ isMobile ? 15 : 8 }px 18px ;
                       ${ isMobile ? 'margin-top: 5px ; margin-bottom: 3px ;' : '' }
                       border-radius: 0 ; border: 1px solid ${ scheme == 'dark' ? 'white' : 'black' };
                       transition: var(--btn-transition) ;
-                          -webkit-transition: var(--btn-transition) ; -moz-transition: var(--btn-transition) ;
-                          -o-transition: var(--btn-transition) ; -ms-transition: var(--btn-transition) }
+                         -webkit-transition: var(--btn-transition) ; -moz-transition: var(--btn-transition) ;
+                         -o-transition: var(--btn-transition) ; -ms-transition: var(--btn-transition) }
                   .chatgpt-modal button:hover {
                       transform: scale(1.055) ; color: black ;
                       background-color: #${ scheme == 'dark' ? '00cfff' : '9cdaff' };
@@ -270,7 +271,7 @@ const chatgpt = {
         }
 
         // Insert text into elems
-        modalTitle.innerText = title || '' ; modalMessage.innerText = msg || '' ; chatgpt.renderHTML(modalMessage)
+        modalTitle.textContent = title || '' ; modalMessage.innerText = msg || '' ; chatgpt.renderHTML(modalMessage)
 
         // Create/append buttons (if provided) to buttons div
         const modalButtons = document.createElement('div')
@@ -421,7 +422,7 @@ const chatgpt = {
                 this.toggle.refreshFrame()
                 document.removeEventListener('visibilitychange', this.toggle.beacons)
                 clearTimeout(this.isActive) ; this.isActive = null
-                console.log(`↻ ChatGPT >> [${ chatgpt.autoRefresh.nowTimeStamp()}] Auto refresh de-activated`)
+                console.log(`↻ ChatGPT >> [${chatgpt.autoRefresh.nowTimeStamp()}] Auto refresh de-activated`)
             } else
                 console.log(`↻ ChatGPT >> [${chatgpt.autoRefresh.nowTimeStamp()}] Auto refresh already inactive!`)
         },
@@ -647,7 +648,7 @@ const chatgpt = {
                   year = now.getFullYear(),
                   hour = now.getHours().toString().padStart(2, '0'),
                   minute = now.getMinutes().toString().padStart(2, '0')
-            filename = `ChatGPT_${ day }-${ month }-${ year }_${ hour }-${ minute }.txt`
+            filename = `ChatGPT_${day}-${month}-${year}_${hour}-${minute}.txt`
 
             // Create transcript from active chat
             if (chatToGet == 'active' && /\/\w{8}-\w{4}-\w{4}-\w{4}-\w{12}$/.test(window.location.href)) {
@@ -691,13 +692,13 @@ const chatgpt = {
         }
 
         // Export transcript
-        console.info(`Exporting transcript as ${ format.toUpperCase() }...`)
+        console.info(`Exporting transcript as ${format.toUpperCase()}...`)
         if (format == 'pdf') { // convert SVGs + launch PDF printer
 
             // Convert SVG icons to data URLs for proper PDF rendering
             transcript = transcript.replace(/<svg.*?<\/svg>/g, (match) => {
                 const dataURL = 'data:image/svg+xml,' + encodeURIComponent(match)
-                return `<img src="${ dataURL }">`
+                return `<img src="${dataURL}">`
             })
 
             // Launch PDF printer
@@ -885,7 +886,7 @@ const chatgpt = {
                             (chatToGet == 'active' && !new RegExp(`\/${re_chatID.source}$`).test(location.href))) {
                         chatToGet = Number.isInteger(chatToGet) ? chatToGet : 0 // preserve index, otherwise get latest
                         if (chatToGet > data.length) // reject if index out-of-bounds
-                            return reject(`🤖 chatgpt.js >> Chat with index ${ chatToGet + 1 }`
+                            return reject(`🤖 chatgpt.js >> Chat with index ${ chatToGet +1 }`
                                 + ` is out of bounds. Only ${data.length} chats exist!`)
                         for (const detail of detailsToGet) detailsToReturn[detail] = data[chatToGet][detail]
                         return resolve(detailsToReturn)
@@ -930,7 +931,7 @@ const chatgpt = {
                         userMessages.sort((a, b) => a.msg.create_time - b.msg.create_time) // sort in chronological order
 
                         if (parseInt(msgToGet, 10) + 1 > userMessages.length) // reject if index out of bounds
-                            return reject(`🤖 chatgpt.js >> Message/response with index ${ msgToGet + 1 }`
+                            return reject(`🤖 chatgpt.js >> Message/response with index ${ msgToGet +1 }`
                                 + ` is out of bounds. Only ${userMessages.length} messages/responses exist!`)
 
                         // Fill [chatGPTMessages]
@@ -938,8 +939,9 @@ const chatgpt = {
                             let sub = []
                             for (const key in data) {
                                 if (data[key].message != null && data[key].message.author.role == 'assistant'
-                                    && data[key].parent == userMessage.id)
+                                    && isUserMsgAncestor(key, userMessage.id)) {
                                         sub.push(data[key].message)
+                                }
                             }
                             sub.sort((a, b) => a.create_time - b.create_time) // sort in chronological order
                             sub = sub.map(x => { // pull out msgs after sorting
@@ -972,6 +974,17 @@ const chatgpt = {
                         return resolve(msgToGet == 'all' ? msgsToReturn // if 'all' passed, return array
                                      : msgToGet == 'latest' ? msgsToReturn[msgsToReturn.length - 1] // else if 'latest' passed, return latest
                                      : msgsToReturn[msgToGet] ) // else return element of array
+
+                        function isUserMsgAncestor(msgID, targetUserID) {
+                            let currentID = msgID ; const maxDepth = 10 ; let depth = 0
+                            while (currentID && depth < maxDepth) {
+                                const currentMsg = data[currentID]
+                                if (!currentMsg?.message) return false
+                                if (currentMsg.id == targetUserID) return true
+                                currentID = currentMsg.parent ; depth++
+                            }
+                            return false
+                        }
                     }
                     xhr.send()
         })})}
@@ -1104,7 +1117,7 @@ const chatgpt = {
             const validMethods = ['POST', 'GET']
             method = (method || '').trim().toUpperCase()
             if (!method || !validMethods.includes(method)) // reject if not valid method
-                return console.error(`Valid methods are ${ validMethods }`)
+                return console.error(`Valid methods are ${validMethods}`)
             if (!token) return console.error('Please provide a valid access token!')
             if (body && typeof body != 'object') // reject if body is passed but not an object
                 return console.error(`Invalid body data type. Got ${ typeof body }, expected object`)
@@ -1125,7 +1138,7 @@ const chatgpt = {
                         return reject('🤖 chatgpt.js >> ' + responseData.detail.description)
                     else if (xhr.status != 200)
                         return reject('🤖 chatgpt.js >> Request failed. Cannot contact custom instructions endpoint.')
-                    console.info(`Custom instructions successfully contacted with method ${ method }`)
+                    console.info(`Custom instructions successfully contacted with method ${method}`)
                     return resolve(responseData || {}) // return response data no matter what the method is
                 }
                 xhr.send(JSON.stringify(body) || '') // if body is passed send it, else just send the request
@@ -1290,7 +1303,12 @@ const chatgpt = {
 
     minify() { chatgpt.code.minify(); },
 
-    notify(msg, position, notifDuration, shadow) {
+    notify(...args) {
+        const scheme = chatgpt.isDarkMode() ? 'dark' : 'light'
+        let msg, position, notifDuration, shadow, toast
+        if (typeof args[0] == 'object' && !Array.isArray(args[0]))
+            ({ msg, position, notifDuration, shadow, toast } = args[0])
+        else [msg, position, notifDuration, shadow] = args
         notifDuration = notifDuration ? +notifDuration : 1.75; // sec duration to maintain notification visibility
         const fadeDuration = 0.35, // sec duration of fade-out
               vpYoffset = 23, vpXoffset = 27 // px offset from viewport border
@@ -1299,7 +1317,7 @@ const chatgpt = {
         const notificationDiv = document.createElement('div') // make div
         notificationDiv.id = Math.floor(chatgpt.randomFloat() * 1000000) + Date.now()
         notificationDiv.classList.add('chatgpt-notif')
-        notificationDiv.innerText = msg // insert msg
+        notificationDiv.textContent = msg // insert msg
         document.body.append(notificationDiv) // insert into DOM
 
         // Create/append close button
@@ -1324,7 +1342,7 @@ const chatgpt = {
                                  + (notificationDiv.isRight ? 'Right' : 'Left')
 
         // Create/append/update notification style (if missing or outdated)
-        const thisUpdated = 1735767823541 // timestamp of last edit for this file's `notifStyle`
+        const thisUpdated = 1746996635555 // timestamp of last edit for this file's `notifStyle`
         let notifStyle = document.querySelector('#chatgpt-notif-style') // try to select existing style
         if (!notifStyle || parseInt(notifStyle.getAttribute('last-updated'), 10) < thisUpdated) { // if missing or outdated
             if (!notifStyle) { // outright missing, create/id/attr/append it first
@@ -1332,7 +1350,7 @@ const chatgpt = {
                 notifStyle.setAttribute('last-updated', thisUpdated.toString())
                 document.head.append(notifStyle)
             }
-            notifStyle.innerText = ( // update prev/new style contents
+            notifStyle.textContent = ( // update prev/new style contents
                 '.chatgpt-notif {'
                     + 'font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC",'
                         + '"Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", sans-serif ;'
@@ -1355,6 +1373,13 @@ const chatgpt = {
                     + '45% { opacity: 0.05 ; transform: rotateX(-81deg) }'
                     + '100% { opacity: 0 ; transform: rotateX(-180deg) scale(1.15) }}'
             )
+            if (toast) notifStyle.textContent += `
+                div.chatgpt-notif {
+                    position: absolute ; left: 50% ; right: 21% !important ; text-align: center ;
+                    ${ scheme == 'dark' ? 'border: 2px solid white ;' : '' }
+                    margin-${ !notificationDiv.isTop ? 'bottom: 105px' : 'top: 42px' };
+                    transform: translate(-50%, -50%) scale(0.6) !important }
+                div.chatgpt-notif > div.notif-close-btn { top: 18px ; right: 7px ; transform: scale(2) }`
         }
 
         // Enqueue notification
@@ -1368,7 +1393,7 @@ const chatgpt = {
         notificationDiv.style.right = notificationDiv.isRight ? vpXoffset.toString() + 'px' : ''
         notificationDiv.style.left = !notificationDiv.isRight ? vpXoffset.toString() + 'px' : ''
 
-        // Reposition old notifications
+        // Re-position old notifications
         const thisQuadrantQueue = notifyProps.queue[notificationDiv.quadrant]
         if (thisQuadrantQueue.length > 1) {
             try { // to move old notifications
@@ -1376,9 +1401,9 @@ const chatgpt = {
                     const oldDiv = document.getElementById(divId),
                           offsetProp = oldDiv.style.top ? 'top' : 'bottom', // pick property to change
                           vOffset = +parseInt(oldDiv.style[offsetProp]) +5 + oldDiv.getBoundingClientRect().height
-                    oldDiv.style[offsetProp] = `${ vOffset }px` // change prop
+                    oldDiv.style[offsetProp] = `${vOffset}px` // change prop
                 }
-            } catch (err) {}
+            } catch (err) { console.warn('Failed to re-position notification:', err) }
         }
 
         // Show notification
@@ -1394,7 +1419,7 @@ const chatgpt = {
 
         // Add notification dismissal to timeout schedule + button clicks
         const dismissNotif = () => {
-            notificationDiv.style.animation = `notif-zoom-fade-out ${ fadeDuration }s ease-out`;
+            notificationDiv.style.animation = `notif-zoom-fade-out ${fadeDuration}s ease-out`;
             clearTimeout(dismissFuncTID)
         }
         const dismissFuncTID = setTimeout(dismissNotif, hideDelay * 1000) // maintain visibility for `hideDelay` secs, then dismiss
@@ -1425,7 +1450,7 @@ const chatgpt = {
         }
         Object.keys(colors).forEach(elem => { // populate dark scheme colors if missing
             colors[elem][1] = colors[elem][1] ||
-                '#' + (Number(`0x1${ colors[elem][0].replace(/^#/, '') }`) ^ 0xFFFFFF)
+                '#' + (Number(`0x1${colors[elem][0].replace(/^#/, '')}`) ^ 0xFFFFFF)
                     .toString(16).substring(1).toUpperCase() // convert to hex
         })
 
@@ -1455,7 +1480,7 @@ const chatgpt = {
                     : (( Object.keys(this).find(obj => Object.keys(this[obj]).includes(this[functionName[1]].name)) + '.' )
                         + this[functionName[1]].name )),
                   isAsync = this[functionName[1]]?.constructor.name == 'AsyncFunction'
-            console.log('%c>> %c' + ( isChatGptObjParent ? '' : `${ functionName[0] }.%c`) + functionName[1]
+            console.log('%c>> %c' + ( isChatGptObjParent ? '' : `${functionName[0]}.%c`) + functionName[1]
                     + ' - https://chatgptjs.org/userguide/' + /(?:.*\.)?(.*)/.exec(rootFunction)[1].toLowerCase() + ( isAsync ? '-async' : '' ) + '\n%c[%c'
                 + ((( functionName[0] == 'chatgpt' && functionName[1] == this[functionName[1]].name ) || // parent is chatgpt + names match or
                     !isChatGptObjParent) // parent is chatgpt.obj
@@ -1640,14 +1665,14 @@ const chatgpt = {
                 const validValues = ['dark', 'light', 'system']
                 if (!value) return console.error('Please specify a scheme value!')
                 if (!validValues.includes(value))
-                    return console.error(`Invalid scheme value. Valid values are [${ validValues }]`)
+                    return console.error(`Invalid scheme value. Valid values are [${validValues}]`)
 
                 // Determine scheme to set
                 let schemeToSet = value
                 if (value == 'system')
                     schemeToSet = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
                 localStorage.setItem('theme', value)
-                console.info(`Scheme set to ${ value.toUpperCase() }.`)
+                console.info(`Scheme set to ${value.toUpperCase()}.`)
 
                 // Toggle scheme if necessary
                 if (!document.documentElement.classList.contains(schemeToSet)) this.toggle()
@@ -1665,7 +1690,7 @@ const chatgpt = {
         for (let i = 0; i < arguments.length; i++) if (typeof arguments[i] != 'string')
             return console.error(`Argument ${ i + 1 } must be a string.`)
         chatgpt.send('What is the sentiment of the following text'
-            + ( entity ? ` towards the entity ${ entity },` : '')
+            + ( entity ? ` towards the entity ${entity},` : '')
             + ' from strongly negative to strongly positive?\n\n' + text )
         console.info('Analyzing sentiment...')
         await chatgpt.isIdle()
@@ -1686,7 +1711,7 @@ const chatgpt = {
             return new Promise((resolve, reject) => {
                 const xhr = new XMLHttpRequest()
                 chatgpt.getChatData(chatToGet).then(chat => {
-                    xhr.open('GET', `${ chatgpt.endpoints.openAI.chat }/${ chat.id }`, true)
+                    xhr.open('GET', `${chatgpt.endpoints.openAI.chat}/${chat.id}`, true)
                     xhr.setRequestHeader('Content-Type', 'application/json')
                     xhr.setRequestHeader('Authorization', 'Bearer ' + token)
                     xhr.onload = () => {
@@ -1719,13 +1744,13 @@ const chatgpt = {
         const confirmShareChat = (token, data) => {
             return new Promise((resolve, reject) => {
                 const xhr = new XMLHttpRequest()
-                xhr.open('PATCH', `${ chatgpt.endpoints.openAI.share }/${ data.share_id }`, true)
+                xhr.open('PATCH', `${chatgpt.endpoints.openAI.share}/${data.share_id}`, true)
                 xhr.setRequestHeader('Content-Type', 'application/json')
                 xhr.setRequestHeader('Authorization', 'Bearer ' + token)
                 xhr.onload = () => {
                     if (xhr.status != 200)
                         return reject('🤖 chatgpt.js >> Request failed. Cannot share chat.')
-                    console.info(`Chat shared at '${ data.share_url }'`)
+                    console.info(`Chat shared at '${data.share_url}'`)
                     return resolve() // the response has nothing useful
                 }
                 xhr.send(JSON.stringify({ // request body
@@ -1762,8 +1787,7 @@ const chatgpt = {
         activateObserver() {
 
             // Stop the previous observer to preserve resources
-            if (this.observer instanceof MutationObserver)
-                try { this.observer.disconnect() } catch (e) {}
+            if (this.observer instanceof MutationObserver) this.observer.disconnect()
 
             if (!this.elems.length) return console.error('🤖 chatgpt.js >> No elems to append!')
 
@@ -1900,7 +1924,7 @@ const chatgpt = {
         for (let i = 0; i < arguments.length; i++) if (typeof arguments[i] != 'string')
             return console.error(`Argument ${ i + 1 } must be a string.`)
         chatgpt.send('Suggest some names. ' + ( details || '' ))
-        console.info(`Creating ${ ideaType }...`)
+        console.info(`Creating ${ideaType}...`)
         await chatgpt.isIdle()
         return chatgpt.getChatData('active', 'msg', 'chatgpt', 'latest')
     },

package/starters/chrome/extension/lib/dom.js

@@ -2,7 +2,6 @@
 // Source: https://github.com/adamlui/ai-web-extensions/blob/main/assets/lib/dom.js/src/dom.js
 
 window.dom = {
-    import(deps) { Object.assign(this.imports = this.imports || {}, deps) },
 
     addRisingParticles(targetNode, { lightScheme = 'gray', darkScheme = 'white' } = {}) {
     // * Requires https://assets.aiwebextensions.com/styles/rising-particles/dist/<lightScheme>.min.css
@@ -12,11 +11,11 @@ window.dom = {
         particlesDivsWrapper.style.cssText = (
             'position: absolute ; top: 0 ; left: 0 ;' // hug targetNode's top-left corner
           + 'height: 100% ; width: 100% ; border-radius: 15px ; overflow: clip ;' // bound innards exactly by targetNode
-          + 'z-index: -1' ); // allow interactive elems to be clicked
-        ['sm', 'med', 'lg'].forEach(particleSize => {
+          + 'z-index: -1' ) // allow interactive elems to be clicked
+        ;['sm', 'med', 'lg'].forEach(particleSize => {
             const particlesDiv = document.createElement('div')
-            particlesDiv.id = this.imports.config?.bgAnimationsDisabled ? `particles-${particleSize}-off`
-                : `${( this.imports.env?.ui?.scheme || this.imports.env?.ui?.app?.scheme ) == 'dark' ? darkScheme
+            particlesDiv.id = config?.bgAnimationsDisabled ? `particles-${particleSize}-off`
+                : `${( env?.ui?.scheme || env?.ui?.app?.scheme ) == 'dark' ? darkScheme
                     : lightScheme }-particles-${particleSize}`
             particlesDivsWrapper.append(particlesDiv)
         })
@@ -41,8 +40,9 @@ window.dom = {
 
         style(content, attrs = {}) {
             const style = document.createElement('style')
+            style.setAttribute('type', 'text/css') // support older browsers
             for (const attr in attrs) style.setAttribute(attr, attrs[attr])
-            if (content) style.innerText = content
+            if (content) style.textContent = content
             return style
         },
 
@@ -94,17 +94,18 @@ window.dom = {
         computedWidth(elems) { return this.computedSize(elems, { dimension: 'width' }) }, // including margins
 
         loadedElem(selector, { timeout = null } = {}) {
-            const timeoutPromise = new Promise(resolve =>
-                timeout ? setTimeout(() => resolve(null), timeout) : undefined)
-            const isLoadedPromise = new Promise(resolve => {
-                const elem = document.querySelector(selector)
-                if (elem) resolve(elem)
-                else new MutationObserver((_, obs) => {
+            const raceEntries = [
+                new Promise(resolve => { // when elem loads
                     const elem = document.querySelector(selector)
-                    if (elem) { obs.disconnect() ; resolve(elem) }
-                }).observe(document.documentElement, { childList: true, subtree: true })
-            })
-            return Promise.race([isLoadedPromise, timeoutPromise])
+                    if (elem) resolve(elem)
+                    else new MutationObserver((_, obs) => {
+                        const elem = document.querySelector(selector)
+                        if (elem) { obs.disconnect() ; resolve(elem) }
+                    }).observe(document.documentElement, { childList: true, subtree: true })
+                })
+            ]
+            if (timeout) raceEntries.push(new Promise(resolve => setTimeout(() => resolve(null), timeout)))
+            return Promise.race(raceEntries)
         }
     }
 };

package/starters/chrome/extension/lib/settings.js

@@ -3,12 +3,14 @@ window.settings = {
 
     controls: {
         // Add settings options as keys, with each key's value being an object that includes:
-        // - 'type': the control type (e.g. 'toggle' or 'prompt')
+        // - 'type': the control type (e.g. 'toggle', 'slider', 'link' or 'prompt')
         // - 'label': a descriptive label
         // - 'defaultVal' (optional): default value of setting (true for toggles if unspecified, false otherwise)
         // - 'category' (optional): string key from this.categories to group control under
         // - 'symbol' (optional): for icon display (e.g. ⌚)
         // - 'helptip' (optional): tooltip to display on hover
+        // - 'throttle' (optional): true/false or ms to disable toggles on click (defaults to 1500 if true)
+        // - 'dependencies' (optional): array of key names of categories/controls that must also be enabled
 
         // NOTE: Controls are displayed in top-to-bottom order (within categories and in top-level)
         // NOTE: Toggles are disabled by default unless defaultVal is true
@@ -26,6 +28,9 @@ window.settings = {
         // - 'color' (optional): hex code (w/o #) of color for left-border
         // - 'helptip' (optional): tooltip to display on hover
         // - 'autoExpand' (optional): true/false to auto-expand categories on toolbar icon click
+        // - 'throttle' (optional): true/false or ms to disable toggles on click (defaults to 1500 if true)
+        // - 'throttle' (optional): true/false or ms to disable toggles on click (defaults to 1500 if true)
+        // - 'dependencies' (optional): array of key names of categories/controls that must also be enabled
 
         // NOTE: Categories are displayed in top-to-bottom order
 
@@ -43,9 +48,11 @@ window.settings = {
 
     load(...keys) {
         return Promise.all(keys.flat().map(async key => // resolve promise when all keys load
-            config[key] = (await chrome.storage.local.get(key))[key]
-                ?? this.controls[key]?.defaultVal ?? this.controls[key]?.type == 'toggle'
-        ))
+            config[key] = (await chrome.storage.local.get(key))[key] ?? initDefaultVal(key)))
+        function initDefaultVal(key) {
+            const ctrlData = settings.controls?.[key]
+            return ctrlData?.defaultVal ?? ( ctrlData?.type == 'slider' ? 100 : ctrlData?.type == 'toggle' )
+        }
     },
 
     save(key, val) {

package/starters/chrome/extension/lib/ui.js

@@ -0,0 +1,6 @@
+window.ui = {
+    getScheme() {
+        return /\b(light|dark)\b/.exec(document.documentElement.className)?.[1]
+            || ( window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light' )
+    }
+};

package/starters/chrome/extension/manifest.json

@@ -3,14 +3,14 @@
   "name": "ChatGPT Extension",
   "short_name": "ChatGPT 🧩",
   "description": "A Chromium extension template to start using chatgpt.js like a boss!",
-  "version": "2025.4.28",
+  "version": "2025.7.27",
   "author": "KudoAI",
   "homepage_url": "https://github.com/KudoAI/chatgpt.js-chrome-starter",
   "icons": { "16": "icons/icon16.png", "32": "icons/icon32.png", "64": "icons/icon64.png", "128": "icons/icon128.png" },
-  "permissions": [ "activeTab", "storage" ],
+  "permissions": ["activeTab", "storage"],
   "action": { "default_popup": "popup/index.html" },
-  "web_accessible_resources": [{ "matches": [ "<all_urls>" ], "resources": [ "components/*", "lib/*" ]}],
-  "content_scripts": [{ "matches": [ "https://chatgpt.com/*" ], "js": [ "content.js" ] }],
+  "web_accessible_resources": [{ "matches": ["<all_urls>"], "resources": ["components/*", "lib/*"] }],
+  "content_scripts": [{ "matches": ["https://chatgpt.com/*"], "js": ["content.js"] }],
   "background": { "service_worker": "service-worker.js" },
   "minimum_chrome_version": "88"
 }