Building web forms with an AI agent means you might be missing the progressive enhancements that boost conversions. Modern Web Guidance helps with this ☑️ By installing this CLI tool, your agent searches a database of best practices before writing a single line of code. The result is forms complete with proper autocomplete values, enterkeyhint attributes, and autofill CSS pseudo-classes. Swipe through the carousel to see the unguided vs guided workflow and learn how to upgrade your agent today → goo.gle/mwg
Chrome for Developers
Technology, Information and Internet
Helping you build, grow, and innovate on the web.
About us
The official Chrome for Developers LinkedIn account from Google. We want to help you build beautiful, accessible, fast, and secure websites that work cross-browser, and for all of your users.
- Website
-
https://developer.chrome.com/
External link for Chrome for Developers
- Industry
- Technology, Information and Internet
- Company size
- 5,001-10,000 employees
Updates
-
Chrome for Developers reposted this
Building WebMCP tools with TypeScript and React? Don’t roll your own types or custom useEffect hooks. Because the WebMCP spec is still experimental and evolving (for example, moving from navigator.modelContext to document.modelContext and using AbortSignal for unregistration), hand-rolled .d.ts files and custom React wrappers go out of date fast. Instead, use the two official packages that are guaranteed to stay up to date with the spec: 1️⃣ webmcp-types npm install -D webmcp-types • Official ambient DOM types for WebMCP. • Automatically infers your execute(args) TypeScript types straight from your JSON inputSchema. 2️⃣ use-webmcp-tool (by Sarah Drasner) npm install use-webmcp-tool • Exposes the useWebMCP hook so your tools follow React’s lifecycle—registering on mount, unregistering on unmount, and toggling cleanly via enabled. • Keeps execute() in sync with fresh React state without re-registering on every render. • Normalizes return values and errors automatically, and degrades gracefully during SSR or on unsupported browsers. Skip the custom glue code and let the official packages track the spec for you. Links in the comments! 👇 #WebMCP #TypeScript #React #WebDevelopment #AI
-
-
PayPal recently tested the WebMCP proposed standard to streamline agentic commerce. By replacing more than 30 complex interface-interaction steps with 3 structured tool calls, they delivered a significantly faster and more consistent E2E checkout experience for AI assistants → https://goo.gle/4yXHc8E
-
Chrome for Developers reposted this
Forms on the web are really underrated, they’re everywhere ✨ There are lots of things we can do today when building them to make them easier for users to fill in and submit. That’s the topic of our latest video. Popular models and agents tend to miss these best practices. They only do an expensive web search for them if they realise they’re missing something, and often they don’t. Have a watch, and if you have thoughts or feedback, drop me a message, I’d love to hear them 💛 YouTube link in the comments! #WebDevelopment #AI #Chrome
-
-
Build more accessible, progressive forms faster with your favorite AI agent. Building web forms with AI agents can often lead to missed opportunities for progressive enhancements that directly impact your conversion rates. In this demo video, we compare two AI coding agents running the exact same prompt to build a checkout form. Watch the agent equipped with Modern Web Guidance: 🏷️ Check for form best practices, surfacing critical context for autocomplete attributes ⌨️ Adds a keyboard Enter key hint 🎨 Styles with the :autofill pseudo-class. Install Modern Web Guidance for your agent today to start writing cleaner web code → goo.gle/mwg
-
Stop adding !important to solve CSS specificity issues → https://goo.gle/4729nY4 Starting in Chrome 151, you no longer need to calculate selector weights in your head or guess why a style isn't applying. You can hover over any selector inside the Styles tab to inspect an accurate breakdown of its specificity weight. This tool helps you tune your selectors precisely instead of relying on !important.
-
Chrome for Developers reposted this
Turn your open tabs and videos into study tools. Jacob Bank, VP of Product, explains how Gemini in Chrome can help make learning seamless. Read more for details: https://goo.gle/4dSnCSS
-
Entry and exit animations in a card-based UI can break if card or screen dimensions change. Newer CSS animation properties can help, but not all browsers support them. We gave a coding agent the same prompt twice: once unaided, once with Modern Web Guidance installed. Compare their results side-by-side below and install Modern Web Guidance here → goo.gle/mwg With the guidance, the agent: ✅ Decoupled entry and exit animations ✅ Avoided fragile percentage calculations ✅ Implemented fallbacks for browsers that don't support needed animation properties
-
We expanded DevTools for agents capabilities so coding agents can perform deep memory debugging and added soft navigation tracking to the Performance panel so SPA route changes can be swiftly measured. On top of that, you can resend network requests straight from the context menu, inspect decoded binary WebSocket payloads, and check CSS specificity on hover → https://goo.gle/4hApcKj
-
-
Chrome for Developers reposted this
🎥 What's new in DevTools in October: https://lnkd.in/dzibMh7B I am back! After meeting so many of you across Google I/O Connect in Berlin, Bengaluru, and Shanghai, I went to the studio for a brand-new episode of What's New in DevTools, covering everything that landed in Chrome 152, 153, and 154! 🏎️ ♻️ Apart from the new, faster release cycle, which brings you two Chrome releases per month going forward, this video brings you up to speed on: • DevTools for Agents with Agent Plugins 1.0, memory debugging, and fine-grained JavaScript execution controls • Performance with full soft navigation support, plus custom CPU performance tier overrides • Elements & Styles with plenty of quality-of-life improvements, like hiding inactive styles and specificity tooltips 📖 If you would rather read than watch, you can find the full breakdown here: https://lnkd.in/dk-ecPzZ As always, thanks to Aaron Gove and Matt Bayfield who produced this with me. Aaron even brought his LEGOs along for some fun bits in our upcoming Developer Tooling Tips episodes! For those of you who want to dive deeper into memory debugging, my colleague Jose Luis Zapata De Santiago wrote excellent documentation on exactly that, walking through how to hand a heap snapshot to an AI agent and actually get somewhere: https://lnkd.in/dqDiVpci 👀 And there is more coming! We also recorded two new Developer Tooling Tips episodes in London: • An episode on Memory debugging with agents, putting Zapata's docs into practice • And one about CLI vs. MCP, when to reach for which, and why the answer isn't always obvious Which of these updates are you trying first?
-