Jetpack Search AI Answers: add dashboard and front end ui.

[gibrown]

This is a squashed commit from developing the feature and multiple experiments with the interface in #48251

Proposed changes

Add an AI powered search answers to the existing search modal.

• Customizable personality and behavior for the AI
• Summarize search results and answer questions directly
• Fills in the gap when there are no search results by relaxing the search query
• Launch for all paid subscribers
• New dashboard tab for customizing and enabling the feature.

Testing

Basics

1. Start up local Jetpack site in docker and connect via jurassic tube so that it is a connected site.
2. Add a site override so you can search content from a site with decent content. Any public site should work. This example uses jetpack.com (which is jetpackme.wordpress.com)

tools/docker/mu-plugins/jetpack-search-site-override.php

/**
 * Override the Search overlay site ID for local development.
 * Allows testing against a specific site's content (e.g. jetpack.com).
 */
add_filter( 'jetpack_instant_search_options', function ( $options ) {
	$options['siteId']          = 20115252; // jetpack.com
	$options['aiAnswersSiteId'] = 20115252; // jetpack.com
	$options['homeUrl']         = 'jetpackme.wordpress.com';
	return $options;
} );

3. Run some search queries on the site with just /?s=search

Testing errors

To test out errors use the following in your browser console:

Network error (simplest — just block it in the Network tab too):

  const _fetch = window.fetch;
  window.fetch = (url, opts) => url.includes('ai/agent')
    ? Promise.reject(new TypeError('Failed to fetch'))
    : _fetch(url, opts);

HTTP error (e.g. 503):

  const _fetch = window.fetch;
  window.fetch = (url, opts) => url.includes('ai/agent')
    ? Promise.resolve(new Response('', { status: 503 }))
    : _fetch(url, opts);

API-level task failure (SSE stream returns the error JSON):

  const _fetch = window.fetch;
  window.fetch = (url, opts) => {
    if (!url.includes('ai/agent')) return _fetch(url, opts);
    const errorEvent = `data: ${JSON.stringify({
      jsonrpc: '2.0', id: 'req-1',
      result: {
        type: 'TaskStatusUpdateEvent',
        status: { state: 'failed', message: { parts: [{ type: 'text', text: 'Task failed on server' }] } }
      },
      error: { code: -32000, message: 'An error occurred while processing the request. Please try again later.' }
    })}\n\n`;
    const stream = new ReadableStream({
      start(c) { c.enqueue(new TextEncoder().encode(errorEvent)); c.close(); }
    });
    return Promise.resolve(new Response(stream, {
      status: 200, headers: { 'Content-Type': 'text/event-stream' }
    }));
  };

Restore normal behaviour:

  window.fetch = _fetch;

Testing on fieldguide or P2

Sandbox the sites you are interested in testing.
Run this command on your sandbox

~/public_html/bin/jetpack-downloader test jetpack jps3-ai-answers

Enable the AI answers option in the jetpack search settings in wp-admin, e.g. http:///wp-admin/admin.php?page=jetpack-search
To test, you must be logged into wordpress.com. I recommend doing this in one tab and then opening the sandboxed site in another tab. You will likely get an SSL/HSTS error. If using Chrome, you can click on 'advanced options' and then type "thisisunsafe". There are other alternatives as well. Search on the Field Guide for "ssl chrome".

Try asking some queries and see what you think of the AI answers.

Turning on the new JPS experience selection in the dashboard

Add into a mu-plugins files:

add_filter( 'jetpack_search_blocks_enabled', '__return_true' );

[github-actions]

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

• ✅ Include a description of your PR changes.
  
• ✅ Add a "[Status]" label (In Progress, Needs Review, ...).
  
• 🔴 Add testing instructions.
  
• 🔴 Specify whether this PR includes any changes to data or privacy.
  
• ✅ Add changelog entries to affected projects
  

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

---

🔴 Action required: Please include detailed testing steps, explaining how to test your change, like so:

## Testing instructions:

* Go to '..'
*

---

🔴 Action required: We would recommend that you add a section to the PR description to specify whether this PR includes any changes to data or privacy, like so:

## Does this pull request change what data or activity we track or use?

My PR adds *x* and *y*.

---

Follow this PR Review Process:

1. Ensure all required checks appearing at the bottom of this PR are passing.
2. Make sure to test your changes on all platforms that it applies to. You're responsible for the quality of the code you ship.
3. You can use GitHub's Reviewers functionality to request a review.
4. When it's reviewed and merged, you will be pinged in Slack to deploy the changes to WordPress.com simple once the build is done.

If you have questions about anything, reach out in #jetpack-developers for guidance!

[github-actions]

Are you an Automattician? Please test your changes on all WordPress.com environments to help mitigate accidental explosions.

• To test on WoA, go to the Plugins menu on a WoA dev site. Click on the "Upload" button and follow the upgrade flow to be able to upload, install, and activate the Jetpack Beta plugin. Once the plugin is active, go to Jetpack > Jetpack Beta, select your plugin (Jetpack or WordPress.com Site Helper), and enable the jps3-ai-answers branch.
• To test on Simple, run the following command on your sandbox:

bin/jetpack-downloader test jetpack jps3-ai-answers

bin/jetpack-downloader test jetpack-mu-wpcom-plugin jps3-ai-answers

Interested in more tips and information?

• In your local development environment, use the jetpack rsync command to sync your changes to a WoA dev blog.
• Read more about our development workflow here: PCYsg-eg0-p2
• Figure out when your changes will be shipped to customers here: PCYsg-eg5-p2

[jp-launch-control]

Code Coverage Summary

Coverage changed in 17 files. Only the first 5 are listed here.

File	Coverage	Δ%	Δ Uncovered
projects/packages/search/src/class-settings.php	0/31 (0.00%)	0.00%	1 ❤️‍🩹
projects/packages/search/src/class-helper.php	313/378 (82.80%)	0.05%	0 💚
projects/packages/search/src/class-rest-controller.php	215/252 (85.32%)	0.36%	0 💚
projects/packages/search/src/dashboard/components/pages/dashboard-page.jsx	47/56 (83.93%)	0.29%	0 💚
projects/packages/search/src/dashboard/store/selectors/jetpack-settings.js	26/26 (100.00%)	0.00%	0 💚

7 files are newly checked for coverage. Only the first 5 are listed here.

File	Coverage
projects/packages/search/src/instant-search/lib/markdown.js	32/60 (53.33%) 💚
projects/packages/search/src/dashboard/hooks/use-search-settings.js	6/7 (85.71%) 💚
projects/packages/search/src/instant-search/components/animated-ellipsis.jsx	9/10 (90.00%) 💚
projects/packages/search/src/class-ai-answers.php	41/43 (95.35%) 💚
projects/packages/search/src/instant-search/components/answers-panel.jsx	23/24 (95.83%) 💚

Full summary · PHP report · JS report

[jjolmo]

I've did just a quick round and smoke test

It is working. I tested also with wrong keywords, the result is expected (No results found)

Some quick smoke test:

Basics

Case	Status
Dashboard tab "AI Answers (Preview)"	✅ Appears after plan upgrade
"Enable AI Answers" toggle	✅ Works and persists
AI ANSWER panel in search overlay	✅ Renders above results
Response streaming	✅ Text appears progressively
"Show more" → expanded response	✅ Setup Steps + Key Features + Sources
Citation tags at the bottom	✅ 5 clickable sources
Fill-the-gap (no results found)	✅ AI still answers when search returns 0

Testing errors

Case	Status
Network error (Failed to fetch)	✅ "Sorry, an error occurred while generating an answer."
HTTP error (503)	✅ Generic error + sub-text "Service Unavailable"
API-level task failure (SSE error JSON)	✅ Generic error + error.message + Error code: -32000
Restore normal fetch	✅ Live answers resume immediately

[jjolmo]

🤖 Minor security nit (defense-in-depth, not a blocker):

Citation URLs from the SSE stream are rendered as <a href={ url }> in two places without scheme validation:

• projects/packages/search/src/instant-search/components/answers-panel.jsx:153
• projects/packages/search/src/instant-search/components/sidebar.jsx:16

React doesn't strip javascript: URLs in href, so a tainted sources[].url from the agent (e.g. via prompt injection in indexed content) would XSS on click. The markdown body is already protected by the ^https?:// allowlist in markdown.js — would be nice to mirror that for citations:

const safeUrl = /^https?:\/\//i.test( citation.url ) ? citation.url : '#';

Also worth wrapping new URL(citation.url).hostname in a try/catch in sidebar.jsx so a malformed URL doesn't crash the panel.

---

Update — PoC reproduced locally

Hijacked fetch to the AI agent endpoint and forged a completed SSE event with a poisoned citation URL:

sources: [{
  title: '👉 PoC: javascript: URL injected as citation',
  url: "javascript:alert('XSS — origin '+document.domain)"
}]

The href round-tripped intact through React render:

[{
  "text": "PoC: javascript: URL injected as citation",
  "href": "javascript:alert('XSS — origin '+document.domain)"
}]

On activation (browser-faithful eval of the href, equivalent to a real click):

{
  "executedOn": "PoC: javascript: URL injected as citation",
  "captured": ["XSS — origin javijetpack.jurassic.tube"]
}

Code executed in the site origin with full access to document.cookie, wp-admin session, and the wpcom REST proxy. Same vector applies to the sidebar.jsx citations block.

[robfelty]

Thanks for the testing @jjolmo - and for the security issue too!

[kangzj]

Hi folks, Just a gentle nudge for the PR to land if everything is looking good now. We are almost ready to launch the Search Blocks, and Dashboard is the final piece now. Let us know if there's anything we could do to help 🙂

cc/ @adamwoodnz

[jjolmo]

I see it in DRAFT so I forgot to approve. But here's my LGTM

[kangzj]

BTW we should probably strip/simplify the docs before merging.

[robfelty]

I am working on resolving merge conflicts and one last update. Then I think we should be ready to go.

[robfelty]

Did lots of testing. I think it is good enough to ship and then do small iterations.