Add WebMCP tool registration for agentic browsing (#9) (#12)
Deploy Company Site / test (push) Successful in 10s
Deploy Company Site / deploy (push) Successful in 4s

## Summary

- Add `WEBMCP_ENABLED` setting and guarded `webmcp-tools.js` loader on public pages
- Register navigation tools (`list_services`, `get_page_content`, `navigate_to_service`, `open_contact_with_subject`) and contact tool (`submit_contact_inquiry`)
- Annotate contact form with declarative WebMCP attributes for Lighthouse form coverage
- Extend `PUBLIC_PAGE_ENTRIES` with summaries shared by SEO and WebMCP tools
- Add `docs/webmcp.md`, update `docs/agentic-browsing.md`, and regression tests

Closes #9

## Test plan

- [x] `python manage.py test public.tests` — 20 tests pass
- [ ] Set `WEBMCP_ENABLED=True`, enable Chrome experimental web platform features flag
- [ ] Verify homepage HTML includes `webmcp-config` and `webmcp-tools.js`
- [ ] Verify `/contact` form has `toolname="submit_contact_inquiry"`
- [ ] Run Lighthouse agentic-browsing on `/` and `/contact` with experimental flag
- [ ] Call `list_services` from WebMCP-capable Chrome on homepage
- [ ] Call `submit_contact_inquiry` on `/contact` with `DEBUG=True` (reCAPTCHA bypass)

Reviewed-on: #12
This commit was merged in pull request #12.
This commit is contained in:
2026-07-02 16:57:47 +00:00
parent 7c9aba7e6c
commit bb5aa6de82
9 changed files with 628 additions and 18 deletions
+14
View File
@@ -44,6 +44,16 @@
{% if user.is_authenticated %}data-user-id="{{ user.pk }}"{% endif %}
hidden></div>
{% endif %}
{% if webmcp_enabled %}
<div id="webmcp-config"
data-page-name="{{ webmcp_page_name }}"
data-contact-url="{{ webmcp_contact_url }}"
data-recaptcha-required="{{ webmcp_recaptcha_required|yesno:'true,false' }}"
data-services='{{ webmcp_services_json|escapejs }}'
data-pages='{{ webmcp_pages_json|escapejs }}'
hidden></div>
{% endif %}
</head>
<body>
@@ -151,6 +161,10 @@
<script src="{% static 'public/js/tianji-consent.js' %}"></script>
{% endif %}
{% if webmcp_enabled %}
<script src="{% static 'public/js/webmcp-tools.js' %}"></script>
{% endif %}
<script>
document.addEventListener('DOMContentLoaded', function () {
const mobileBtn = document.querySelector('.mobile-menu-btn');
@@ -33,7 +33,8 @@
<div class="card">
<h2 class="card-title contact-form-heading" id="contact-form-heading" style="margin-bottom: 2rem;">Send Us a Message</h2>
<form action="{% url 'contact' %}" method="POST" aria-labelledby="contact-form-heading">
<form action="{% url 'contact' %}" method="POST" aria-labelledby="contact-form-heading"
{% if webmcp_enabled %}toolname="submit_contact_inquiry" tooldescription="Submit a contact inquiry to AI ML Operations"{% endif %}>
{% csrf_token %}
<div class="form-row">
<div class="form-group">