1<!DOCTYPE html> 2<html> 3<head> 4 <title>Trace Example</title> 5 <style> 6 * { 7 box-sizing: border-box; 8 } 9 10 html, body { 11 height: 100%; 12 margin: 0; 13 padding: 0; 14 } 15 </style> 16 <script type="text/javascript"> 17 // Light = 1,Dark = 2,HighContrast = 3 18 window.addEventListener('message', event => { 19 const message = event.data; 20 let spApplication = document.getElementsByTagName("sp-application")[0] 21 spApplication.vs = true 22 switch (message.colorThemeKind) { 23 case 1: 24 spApplication.dark = false; 25 break; 26 case 2: 27 spApplication.dark = true; 28 break; 29 default: 30 spApplication.dark = true; 31 break; 32 } 33 }); 34 </script> 35</head> 36<body> 37<script type="text/javascript"> 38 'use strict'; 39 let req = new XMLHttpRequest(); 40 req.open('GET', document.location, false); 41 req.send(null); 42 window.version = req.getResponseHeader('data-version') || "" 43</script> 44<script src="trace/SpApplication.js" type="module"></script> 45<sp-application wasm query-sql></sp-application> 46</body> 47</html> 48