this repo has no description

widget-leaflet: add Playwright adapter test

Tests addMarker, clearMarkers, addImageOverlay, removeImageOverlay
commands in a standalone HTML page.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

+89
+89
js_top_worker/widget-leaflet/test/test_adapter.html
··· 1 + <!DOCTYPE html> 2 + <html> 3 + <head> 4 + <title>widget-leaflet adapter test</title> 5 + <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" /> 6 + <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script> 7 + <style>#map { width: 600px; height: 400px; }</style> 8 + </head> 9 + <body> 10 + <h1>Widget-Leaflet Adapter Test</h1> 11 + <div id="map"></div> 12 + <p>Status: <span id="status">initializing...</span></p> 13 + <script> 14 + var container = document.getElementById('map'); 15 + var div = document.createElement("div"); 16 + div.style.cssText = "width:100%;height:100%"; 17 + container.appendChild(div); 18 + var map = L.map(div).setView([51.505, -0.09], 13); 19 + L.tileLayer("https://tile.openstreetmap.org/{z}/{x}/{y}.png", { 20 + maxZoom: 19, attribution: "&copy; OpenStreetMap" 21 + }).addTo(map); 22 + 23 + var state = { 24 + map: map, geojsonLayer: null, bboxRect: null, 25 + bboxDrawing: false, imageOverlay: null, markers: [], 26 + _send: function(type, data) {} 27 + }; 28 + 29 + function command(cmd, data) { 30 + if (!state.map) return; 31 + var d = data ? JSON.parse(data) : {}; 32 + if (cmd === "addMarker") { 33 + var marker = L.circleMarker(L.latLng(d.lat, d.lng), { 34 + radius: 6, color: d.color || "#ff0000", fillColor: d.color || "#ff0000", 35 + fillOpacity: 0.8, weight: 2 36 + }).addTo(state.map); 37 + if (d.label) marker.bindTooltip(d.label, {permanent: true, direction: "right", offset: [8, 0]}); 38 + state.markers.push(marker); 39 + } 40 + else if (cmd === "clearMarkers") { 41 + state.markers.forEach(function(m) { state.map.removeLayer(m); }); 42 + state.markers = []; 43 + } 44 + else if (cmd === "addImageOverlay") { 45 + if (state.imageOverlay) state.map.removeLayer(state.imageOverlay); 46 + state.imageOverlay = L.imageOverlay(d.url, d.bounds, { 47 + opacity: d.opacity || 0.7 48 + }).addTo(state.map); 49 + } 50 + else if (cmd === "removeImageOverlay") { 51 + if (state.imageOverlay) { state.map.removeLayer(state.imageOverlay); state.imageOverlay = null; } 52 + } 53 + } 54 + 55 + var results = []; 56 + try { 57 + // Test 1: Add markers 58 + command("addMarker", JSON.stringify({lat: 51.505, lng: -0.09, color: "blue", label: "Point A"})); 59 + command("addMarker", JSON.stringify({lat: 51.51, lng: -0.08, color: "red", label: "Point B"})); 60 + results.push("markers=" + state.markers.length); 61 + 62 + // Test 2: Add image overlay 63 + var tinyPng = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg=="; 64 + command("addImageOverlay", JSON.stringify({ 65 + url: tinyPng, 66 + bounds: [[51.5, -0.1], [51.51, -0.08]], 67 + opacity: 0.5 68 + })); 69 + results.push("hasOverlay=" + (state.imageOverlay !== null)); 70 + 71 + // Test 3: Clear markers 72 + command("clearMarkers", ""); 73 + results.push("markersAfterClear=" + state.markers.length); 74 + 75 + // Test 4: Remove overlay 76 + command("removeImageOverlay", ""); 77 + results.push("overlayAfterRemove=" + (state.imageOverlay === null ? "null" : "exists")); 78 + 79 + // Test 5: Re-add markers to verify state reset 80 + command("addMarker", JSON.stringify({lat: 51.505, lng: -0.09})); 81 + results.push("markersAfterReadd=" + state.markers.length); 82 + 83 + document.getElementById('status').textContent = results.join(" ") + " ALL_PASSED"; 84 + } catch(e) { 85 + document.getElementById('status').textContent = "FAILED: " + e.message; 86 + } 87 + </script> 88 + </body> 89 + </html>