04-check-setup.html

<!--
  A setup checker for "why aren't my tools showing?". It checks the page
  is secure and the browser supports WebMCP, then asks Subcontext for your
  tool list directly (the same request the script makes), so you see the
  exact error if something is wrong. Replace wmk_YOUR_KEY with your
  integration's key, and open the page on one of the integration's websites.
-->
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>WebMCP: setup checker</title>
  <style>
    .pass::before { content: "PASS  "; color: green; font-weight: bold; }
    .fail::before { content: "FAIL  "; color: red; font-weight: bold; }
    .info::before { content: "INFO  "; color: gray; font-weight: bold; }
  </style>
</head>
<body>
  <h1>Setup checker</h1>
  <p>
    Checks why your tools might not be showing. It asks Subcontext for your tool list directly,
    without the script, so if something is wrong you see the exact error and what to do about it.
  </p>
  <ul id="checks"></ul>
  <h2>The tool list for this key</h2>
  <pre id="tools">(not loaded)</pre>

  <script>
    // Your integration's key (starts wmk_). In the dashboard: Organisation > Agent access >
    // Manage WebMCP tools, then open the integration.
    var KEY = 'wmk_YOUR_KEY'

    // What each error code means, and what to change.
    var FIXES = {
      invalid_key: 'The key is wrong or was rotated. Copy it again from the integration\'s page in the dashboard.',
      key_disabled: 'Tick Enabled on the integration (Organisation > Agent access > Manage WebMCP tools).',
      not_entitled: 'Your plan doesn\'t include agent access, or your account isn\'t paid up. Ask Subcontext (hello@subcontext.com).',
      origin_not_allowed: 'Add ' + location.origin + ' to the integration\'s websites (http and https, and www and the bare domain, count as different websites).'
    }

    function report(status, text) {
      var item = document.createElement('li')
      item.className = status
      item.textContent = text
      document.getElementById('checks').appendChild(item)
    }

    report(window.isSecureContext ? 'pass' : 'fail',
      'Secure page: ' + (window.isSecureContext ? 'yes' : 'no (WebMCP needs https, or localhost while testing)'))

    // The script uses document.modelContext, else navigator.modelContext.
    var supported = [document.modelContext, navigator.modelContext].some(function (context) {
      return context && typeof context.registerTool === 'function'
    })
    report(supported ? 'pass' : 'fail', 'WebMCP: ' + (supported
      ? 'supported in this browser'
      : 'not available. This browser doesn\'t support it, or it is switched off. The check below still works'))

    report('info', 'This page\'s website (the integration must list it): ' + location.origin)

    fetch('https://subcontext.com/api/v1/webmcp/config', { headers: { 'X-Webmcp-Key': KEY } })
      .then(function (response) {
        return response.json().then(function (body) {
          if (body.error) {
            report('fail', 'Tool list: ' + response.status + ' ' + body.error.code + ': "' + body.error.message + '" ' + (FIXES[body.error.code] || ''))
            return
          }
          var tools = body.data.tools
          report(tools.length ? 'pass' : 'fail', 'Tool list: ' + tools.length + ' tool(s) for ' + body.data.org.name +
            (tools.length ? '' : '. Tick some tools on the integration in the dashboard.'))
          document.getElementById('tools').textContent = JSON.stringify(body.data, null, 2)
        })
      })
      .catch(function (error) {
        // The request was blocked, the network failed, or the answer wasn't JSON.
        report('fail', 'Tool list: ' + error.message + '. Could not get an answer from https://subcontext.com: check your connection and your content security policy.')
      })
  </script>
</body>
</html>