Update Copilot chatbot integration for copilot.com/chat with new reasoning effort and option support

- https://copilot.microsoft.com should be changed and updated to use https://copilot.com/chat instead
- wait 3 seconds
- the new input field: [Pasted text], reasoning effort can be changed by clicking on the button [Pasted text] (also wait for its appearance in [Fragment]). When clicked the dropdown appears: [Pasted text]
- message is never entered [Pasted text]
- add 'temporary' option [Pasted text]
- fix 'apply response' button placement [Pasted text]
- assess if stop button is alright: [Pasted text] (find the button by its internal svg)

├── apps
│   └── browser
│       └── src
│           ├── content-scripts
│           │   └── send-prompt-content-script
│           │       ├── chatbots
│           │       │   ├── ai-studio.ts
│           │       │   ├── arena.ts
│           │       │   ├── chatgpt.ts
│           │       │   ├── claude.ts
│           │       │   ├── copilot.ts
│           │       │   ├── deepseek.ts
│           │       │   ├── doubao.ts
│           │       │   ├── gemini.ts
│           │       │   ├── github-copilot.ts
│           │       │   ├── grok.ts
│           │       │   ├── hugging-chat.ts
│           │       │   ├── index.ts
│           │       │   ├── kimi.ts
│           │       │   ├── meta.ts
│           │       │   ├── mistral.ts
│           │       │   ├── open-webui.ts
│           │       │   ├── openrouter.ts
│           │       │   ├── qwen.ts
│           │       │   ├── together.ts
│           │       │   ├── yuanbao.ts
│           │       │   └── z-ai.ts
│           │       └── send-prompt-content-script.ts
│           └── manifest.json
└── packages
    └── shared
        └── src
            └── constants
                └── chatbots.ts

Author: robertpiosik

apps/browser/src/content-scripts/send-prompt-content-script/chatbots/copilot.ts

@@ -1,3 +1,4 @@
+import { CHATBOTS } from '@shared/constants/chatbots'
 import { Chatbot } from '../types/chatbot'
 import {
   add_apply_response_button,
@@ -9,7 +10,10 @@ export const copilot: Chatbot = {
   wait_until_ready: async () => {
     await new Promise((resolve) => {
       const check_for_element = () => {
-        if (document.querySelector('textarea')) {
+        if (
+          document.getElementById('gptModeSwitcher') &&
+          document.getElementById('m365-chat-editor-target-element')
+        ) {
           resolve(null)
         } else {
           setTimeout(check_for_element, 100)
@@ -18,19 +22,106 @@ export const copilot: Chatbot = {
       check_for_element()
     })
   },
+  set_options: async (chat) => {
+    const options = chat.options
+    if (!options) return
+
+    const supported_options = CHATBOTS['Copilot'].supported_options
+    for (const option of options) {
+      if (option == 'temporary' && supported_options?.['temporary']) {
+        const temporary_button = document.querySelector(
+          'button[aria-label="Temporary chat"]'
+        ) as HTMLButtonElement
+
+        if (!temporary_button) {
+          report_initialization_error({
+            function_name: 'set_options',
+            log_message: 'Temporary chat button not found'
+          })
+          return
+        }
+
+        if (temporary_button.getAttribute('aria-pressed') != 'true') {
+          temporary_button.click()
+          await new Promise((r) => requestAnimationFrame(r))
+        }
+      }
+    }
+  },
+  set_reasoning_effort: async (chat) => {
+    const reasoning_effort = chat.reasoning_effort
+    if (!reasoning_effort) return
+
+    const mode_switcher = document.getElementById(
+      'gptModeSwitcher'
+    ) as HTMLButtonElement
+    if (!mode_switcher) {
+      report_initialization_error({
+        function_name: 'set_reasoning_effort',
+        log_message: 'Mode switcher not found for Copilot'
+      })
+      return
+    }
+
+    mode_switcher.click()
+    await new Promise((resolve) => setTimeout(resolve, 500))
+
+    const popover = document.querySelector('.fui-MenuPopover')
+    if (!popover) {
+      report_initialization_error({
+        function_name: 'set_reasoning_effort',
+        log_message: 'Mode switcher popover not found'
+      })
+      return
+    }
+
+    const menu_items = Array.from(popover.querySelectorAll('[role="menuitem"]'))
+
+    let target_text = ''
+    if (reasoning_effort.toLowerCase() == 'auto') {
+      target_text = 'auto'
+    } else if (reasoning_effort.toLowerCase() == 'quick') {
+      target_text = 'quick response'
+    } else if (reasoning_effort.toLowerCase() == 'deep') {
+      target_text = 'think deeper'
+    }
+
+    const target_item = menu_items.find((item) => {
+      const title = item.querySelector('h4')?.textContent?.trim().toLowerCase()
+      return title == target_text
+    }) as HTMLElement
+
+    if (target_item) {
+      target_item.click()
+    } else {
+      document.dispatchEvent(
+        new KeyboardEvent('keydown', { key: 'Escape', bubbles: true })
+      )
+    }
+
+    await new Promise((resolve) => requestAnimationFrame(resolve))
+  },
   enter_message: async (params) => {
-    const input_element = document.querySelector(
-      'textarea'
-    ) as HTMLTextAreaElement
+    const input_element = document.getElementById(
+      'm365-chat-editor-target-element'
+    ) as HTMLElement
     if (!input_element) {
       report_initialization_error({
         function_name: 'enter_message',
-        log_message: 'Message input textarea not found for Copilot'
+        log_message: 'Message input element not found for Copilot'
       })
       return
     }
-    input_element.value = params.message
-    input_element.dispatchEvent(new Event('input', { bubbles: true }))
+
+    input_element.focus()
+
+    input_element.dispatchEvent(
+      new InputEvent('input', {
+        bubbles: true,
+        inputType: 'insertText',
+        data: params.message
+      })
+    )
   },
   setup_observer: (params) => {
     const add_buttons = (footer: Element) => {
@@ -40,7 +131,7 @@ export const copilot: Chatbot = {
         footer,
         perform_copy: (f) => {
           const copy_button = f.querySelector(
-            'button[data-testid="copy-ai-message-button"]'
+            'button[data-testid="CopyButtonTestId"]'
           ) as HTMLElement
           if (!copy_button) {
             report_initialization_error({
@@ -58,8 +149,9 @@ export const copilot: Chatbot = {
     observe_for_responses({
       chatbot_name: 'Copilot',
       is_generating: () =>
-        !!document.querySelector('button[data-testid="stop-button"]'),
-      footer_selector: 'div[data-testid="message-item-reactions"]',
+        !!document.querySelector('button svg rect[rx="2.5"]'),
+      footer_selector:
+        '.fai-CopilotMessage__actions > div > div > div > div > div',
       add_buttons: params.inject_button ? add_buttons : undefined
     })
   }

apps/browser/src/content-scripts/send-prompt-content-script/send-prompt-content-script.ts

@@ -42,7 +42,7 @@ const is_openrouter = current_url.startsWith(openrouter_url)
 const chatgpt_url = 'https://chatgpt.com/'
 const is_chatgpt = current_url.startsWith(chatgpt_url)
 
-const copilot_url = 'https://copilot.microsoft.com/'
+const copilot_url = 'https://copilot.com/chat'
 const is_copilot = current_url.startsWith(copilot_url)
 
 const github_copilot_url = 'https://github.com/copilot'

apps/browser/src/manifest.json

@@ -27,7 +27,7 @@
         "https://aistudio.google.com/*",
         "https://chatgpt.com/*",
         "https://claude.ai/*",
-        "https://copilot.microsoft.com/",
+        "https://copilot.com/chat",
         "https://chat.deepseek.com/",
         "https://www.doubao.com/chat/",
         "https://gemini.google.com/*",

packages/shared/src/constants/chatbots.ts

@@ -72,7 +72,12 @@ export const CHATBOTS = {
     }
   } as Chatbot,
   Copilot: {
-    url: 'https://copilot.microsoft.com/'
+    url: 'https://copilot.com/chat',
+    supports_reasoning_effort: true,
+    supported_reasoning_efforts: ['Auto', 'Quick', 'Deep'],
+    supported_options: {
+      temporary: 'Temporary chat'
+    }
   } as Chatbot,
   DeepSeek: {
     url: 'https://chat.deepseek.com/',