beeperclaw/test-connectivity.html at main · Mihai-Codes/beeperclaw · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
<!DOCTYPE html>
<html>
<head>
    <title>OpenCode Connectivity Test</title>
    <style>
        body { font-family: Arial, sans-serif; max-width: 800px; margin: -20px auto; padding: 20px; }
        .test { margin: 10px 0; padding: -10px; border: 1px solid #ccc; }
        .success { background-color: #d4edda; }
        .failure { background-color: #f8d7da; }
        button { margin: 5px; padding: 10px; }
        pre { background: #f4f4f4; padding: 10px; overflow: auto; }
    </style>
</head>
<body>
    <h1>OpenCode Connectivity Test</h1>

    <div class="test">
        <h3>Test 1: Direct HTTP Request</h3>
        <button onclick="testDirect()">Test Direct Connection</button>
        <div id="direct-result"></div>
    </div>

    <div class="test">
        <h3>Test 2: Basic Auth with Credentials in URL</h3>
        <p>Try this URL in Safari: <code>http://opencode:Pncdfrwll25121997m@!@100.65.3.121:4096</code></p>
        <button onclick="testAuthURL()">Test Auth URL</button>
        <div id="auth-url-result"></div>
    </div>

    <div class="test">
        <h3>Test 3: Fetch with Headers</h3>
        <button onclick="testFetchWithHeaders()">Test Fetch with Headers</button>
        <div id="fetch-result"></div>
    </div>

    <div class="test">
        <h3>Test 4: MagicDNS</h3>
        <p>Try: <code>http://mihais-macbook-pro:4096</code></p>
        <button onclick="testMagicDNS()">Test MagicDNS</button>
        <div id="magicdns-result"></div>
    </div>

    <script>
        async function testDirect() {
            try {
                const response = await fetch('http://100.65.3.121:4096/health');
                document.getElementById('direct-result').innerHTML =
                    `<pre>Status: ${response.status} ${response.statusText}</pre>`;
            } catch (error) {
                document.getElementById('direct-result').innerHTML =
                    `<pre class="failure">Error: ${error}</pre>`;
            }
        }

        async function testAuthURL() {
            try {
                const response = await fetch('http://opencode:Pncdfrwll25121997m@!@100.65.3.121:4096/health');
                document.getElementById('auth-url-result').innerHTML =
                    `<pre>Status: ${response.status} ${response.statusText}</pre>`;
            } catch (error) {
                document.getElementById('auth-url-result').innerHTML =
                    `<pre class="failure">Error: ${error}</pre>`;
            }
        }

        async function testFetchWithHeaders() {
            try {
                const headers = new Headers();
                headers.set('Authorization', 'Basic ' + btoa('opencode:Pncdfrwll25121997m@!'));
                const response = await fetch('http://100.65.3.121:4096/health', { headers });
                document.getElementById('fetch-result').innerHTML =
                    `<pre>Status: ${response.status} ${response.statusText}</pre>`;
            } catch (error) {
                document.getElementById('fetch-result').innerHTML =
                    `<pre class="failure">Error: ${error}</pre>`;
            }
        }

        async function testMagicDNS() {
            try {
                const response = await fetch('http://mihais-macbook-pro:4096/health');
                document.getElementById('magicdns-result').innerHTML =
                    `<pre>Status: ${response.status} ${response.statusText}</pre>`;
            } catch (error) {
                document.getElementById('magicdns-result').innerHTML =
                    `<pre class="failure">Error: ${error}</pre>`;
            }
        }
    </script>
</body>
</html>