zw_monitor
/
monitor


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
							<!doctype html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>ESM格式监控SDK测试</title>
  </head>
  <body>
    <h1>ESM格式监控SDK测试页面</h1>
    <p>此页面用于测试ES模块格式的监控SDK是否正常工作。</p>

    <div id="test-container">
      <button id="test-esm-sdk">测试ESM格式SDK</button>
      <button id="test-esm-functionality">测试ESM功能</button>
    </div>

    <div id="result">
      <h3>控制台输出：</h3>
      <p>请打开开发者工具查看监控SDK的输出信息</p>
    </div>

    <!-- 使用ES模块语法导入SDK -->
    <script type="module">
      // 从ESM格式的bundle中导入
      // 注意：由于我们的bundle没有导出默认对象，我们需要使用动态导入
      console.log("开始测试ESM格式的监控SDK");

      // 动态导入ESM格式的bundle
      import("../dist/bundle-esm.js")
        .then((module) => {
          console.log("ESM格式的监控SDK已加载");
          console.log("模块内容:", module);

          // 检查全局对象是否可用（我们的代码会在全局作用域创建实例）
          if (window.MonitorSDK && window.monitorInstance) {
            console.log("✅ ESM格式SDK成功初始化全局对象");

            // 绑定按钮事件
            document.getElementById("test-esm-sdk").addEventListener("click", function () {
              console.log("测试ESM格式SDK功能");

              // 测试SDK实例
              if (window.monitorInstance) {
                console.log("SDK实例存在，版本信息:", window.monitorInstance.config);

                // 测试数据上报
                window.monitorInstance.reportData({
                  type: "esm_test_event",
                  message: "ESM格式SDK测试事件",
                  timestamp: Date.now(),
                });
              }
            });

            document
              .getElementById("test-esm-functionality")
              .addEventListener("click", function () {
                console.log("测试ESM格式SDK各项功能");

                // 测试错误上报
                try {
                  throw new Error("ESM格式SDK测试错误");
                } catch (e) {
                  window.monitorInstance.reportError({
                    type: "esm_test_error",
                    message: e.message,
                    stack: e.stack,
                    timestamp: Date.now(),
                  });
                }

                // 测试性能数据
                window.monitorInstance.reportData({
                  type: "esm_performance_test",
                  loadTime: 100,
                  timestamp: Date.now(),
                });
              });
          } else {
            console.error("❌ ESM格式SDK未正确初始化全局对象");
          }
        })
        .catch((error) => {
          console.error("❌ 加载ESM格式的bundle时出错:", error);
        });
    </script>
  </body>
</html>