devtools-mcp-seminar/.opencode/skills/ms-teams-text-formatting/SKILL.md

name, description

name	description
ms-teams-text-formatting	Use when applying bold, italic, underline, strikethrough, lists, quote, code, or links to text in the MS Teams chat compose box via Chrome DevTools MCP. Use ONLY when the user asks to format text in an MS Teams message.

MS Teams text formatting

How to apply inline and block formatting to text in the MS Teams chat compose box via Chrome DevTools MCP. Verified empirically against the live Teams web app (CKEditor / FluentUI).

Inline formatting (bold / italic / underline / strikethrough)

All four work via keyboard shortcuts, applied to the current selection. Type the text, select it (e.g. Control+A for all, or Shift+Arrow / double-click for a substring), then press the shortcut.

Format	Shortcut	Resulting HTML
Bold	Ctrl+B	<strong>...</strong>
Italic	Ctrl+I	<i>...</i>
Underline	Ctrl+U	<u>...</u>
Strikethrough	Ctrl+Alt+X	<s>...</s>

Formats nest cleanly — e.g. Ctrl+B then Ctrl+I on the same selection yields <i><strong>text</strong></i>. Pressing a shortcut on an already- formatted selection toggles that format off.

No need to open the formatting toolbar UI; the shortcuts work while the editor is focused, even with the toolbar collapsed.

Block formatting (lists / quote / code / link)

Also driven by shortcuts, no toolbar interaction required:

Block	Shortcut	Notes
Bulleted list	* or - then space at line start	CKEditor auto-converts the leading marker.
Numbered list	1. or 1) then space at line start	Same auto-convert behavior.
Quote	Ctrl+Alt+4	Toggles quote block on current paragraph.
Code (inline)	Ctrl+Alt+Shift+C	Wraps selection in <code>.
Code block	Ctrl+Alt+Shift+B	Inserts a <pre><code> block.
Link	Ctrl+K	Opens link dialog (URL + optional text).

Toolbar-only formats (no shortcut)

These require opening the formatting toolbar and clicking the button:

Action	Toolbar button aria-label
Text highlight color	"Text highlight color"
Font color	"Font color"
Font size	"Font size"
Paragraph style	"Paragraph"
Clear all formatting	"Clear all formatting"
Decrease indent	"Decrease indent"
Increase indent	"Increase indent"
Insert horizontal rule	"Insert horizontal rule"

Open the toolbar with Ctrl+Shift+X (or click "Show Formatting options"), then click via evaluate_script:

() => {
  const btn = Array.from(document.querySelectorAll('button'))
    .find(b => b.getAttribute('aria-label') === 'Font color');
  btn.click();
}