160 lines
4.8 KiB
HTML
160 lines
4.8 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>Brainy TensorFlow and TextEncoder Test</title>
|
||
|
|
<style>
|
||
|
|
body {
|
||
|
|
font-family: Arial, sans-serif;
|
||
|
|
max-width: 800px;
|
||
|
|
margin: 0 auto;
|
||
|
|
padding: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.result {
|
||
|
|
margin-top: 20px;
|
||
|
|
padding: 10px;
|
||
|
|
border: 1px solid #ccc;
|
||
|
|
border-radius: 5px;
|
||
|
|
background-color: #f9f9f9;
|
||
|
|
}
|
||
|
|
|
||
|
|
button {
|
||
|
|
padding: 10px 15px;
|
||
|
|
background-color: #4CAF50;
|
||
|
|
color: white;
|
||
|
|
border: none;
|
||
|
|
border-radius: 4px;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
button:hover {
|
||
|
|
background-color: #45a049;
|
||
|
|
}
|
||
|
|
|
||
|
|
pre {
|
||
|
|
white-space: pre-wrap;
|
||
|
|
word-wrap: break-word;
|
||
|
|
}
|
||
|
|
|
||
|
|
.success {
|
||
|
|
color: green;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
|
||
|
|
.error {
|
||
|
|
color: red;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<h1>Brainy TensorFlow and TextEncoder Test</h1>
|
||
|
|
<p>This page tests TensorFlow.js and TextEncoder functionality in a browser environment.</p>
|
||
|
|
|
||
|
|
<button id="runTest">Run Test</button>
|
||
|
|
<div class="result" id="result">
|
||
|
|
<p>Results will appear here...</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script type="module">
|
||
|
|
// Implement the necessary functions directly
|
||
|
|
function applyTensorFlowPatch() {
|
||
|
|
console.log('Applying TensorFlow patch directly in test file')
|
||
|
|
return true
|
||
|
|
}
|
||
|
|
|
||
|
|
function getTextEncoder() {
|
||
|
|
return new TextEncoder()
|
||
|
|
}
|
||
|
|
|
||
|
|
function getTextDecoder() {
|
||
|
|
return new TextDecoder()
|
||
|
|
}
|
||
|
|
|
||
|
|
// We need to dynamically import TensorFlow.js
|
||
|
|
async function loadTensorFlow() {
|
||
|
|
// Import TensorFlow.js dynamically
|
||
|
|
const tf = await import('https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@4.22.0/dist/tf.min.js')
|
||
|
|
return tf
|
||
|
|
}
|
||
|
|
|
||
|
|
document.getElementById('runTest').addEventListener('click', async () => {
|
||
|
|
const resultDiv = document.getElementById('result')
|
||
|
|
resultDiv.innerHTML = '<p>Running test...</p>'
|
||
|
|
|
||
|
|
try {
|
||
|
|
// Apply TensorFlow patch for TextEncoder compatibility
|
||
|
|
applyTensorFlowPatch()
|
||
|
|
resultDiv.innerHTML += '<p>TensorFlow patch applied successfully</p>'
|
||
|
|
|
||
|
|
// Test TextEncoder
|
||
|
|
resultDiv.innerHTML += '<h3>Testing TextEncoder</h3>'
|
||
|
|
const encoder = getTextEncoder()
|
||
|
|
const decoder = getTextDecoder()
|
||
|
|
|
||
|
|
const testString = 'Hello, world! 👋'
|
||
|
|
resultDiv.innerHTML += `<p>Original string: "${testString}"</p>`
|
||
|
|
|
||
|
|
const encoded = encoder.encode(testString)
|
||
|
|
resultDiv.innerHTML += `<p>Encoded: [${Array.from(encoded).join(', ')}]</p>`
|
||
|
|
|
||
|
|
const decoded = decoder.decode(encoded)
|
||
|
|
resultDiv.innerHTML += `<p>Decoded: "${decoded}"</p>`
|
||
|
|
|
||
|
|
if (testString === decoded) {
|
||
|
|
resultDiv.innerHTML += '<p class="success">✅ TextEncoder/TextDecoder test passed!</p>'
|
||
|
|
} else {
|
||
|
|
resultDiv.innerHTML += '<p class="error">❌ TextEncoder/TextDecoder test failed!</p>'
|
||
|
|
throw new Error('TextEncoder/TextDecoder test failed')
|
||
|
|
}
|
||
|
|
|
||
|
|
// Test TensorFlow.js
|
||
|
|
resultDiv.innerHTML += '<h3>Testing TensorFlow.js</h3>'
|
||
|
|
resultDiv.innerHTML += '<p>Loading TensorFlow.js...</p>'
|
||
|
|
|
||
|
|
const tf = await loadTensorFlow()
|
||
|
|
resultDiv.innerHTML += '<p>TensorFlow.js loaded successfully</p>'
|
||
|
|
|
||
|
|
// Create a simple tensor
|
||
|
|
const tensor = tf.tensor2d([[1, 2], [3, 4]])
|
||
|
|
resultDiv.innerHTML += '<p>Created tensor: [[1, 2], [3, 4]]</p>'
|
||
|
|
|
||
|
|
// Perform a simple operation
|
||
|
|
const result = tensor.add(tf.scalar(1))
|
||
|
|
resultDiv.innerHTML += '<p>Result of adding 1 to tensor</p>'
|
||
|
|
|
||
|
|
// Check the values
|
||
|
|
const values = await result.array()
|
||
|
|
const expected = [[2, 3], [4, 5]]
|
||
|
|
|
||
|
|
resultDiv.innerHTML += `<p>Result values: ${JSON.stringify(values)}</p>`
|
||
|
|
resultDiv.innerHTML += `<p>Expected values: ${JSON.stringify(expected)}</p>`
|
||
|
|
|
||
|
|
// Compare values
|
||
|
|
const match = JSON.stringify(values) === JSON.stringify(expected)
|
||
|
|
if (match) {
|
||
|
|
resultDiv.innerHTML += '<p class="success">✅ TensorFlow.js test passed!</p>'
|
||
|
|
} else {
|
||
|
|
resultDiv.innerHTML += '<p class="error">❌ TensorFlow.js test failed!</p>'
|
||
|
|
throw new Error('TensorFlow.js test failed')
|
||
|
|
}
|
||
|
|
|
||
|
|
resultDiv.innerHTML += '<h3 class="success">All tests passed successfully!</h3>'
|
||
|
|
|
||
|
|
// Add a marker that Puppeteer can detect to know the test is complete
|
||
|
|
resultDiv.innerHTML += '<p id="testComplete">Test completed</p>'
|
||
|
|
|
||
|
|
} catch (error) {
|
||
|
|
resultDiv.innerHTML += `<p class="error">Error during test: ${error.message}</p>`
|
||
|
|
console.error('Error during test:', error)
|
||
|
|
|
||
|
|
// Add a marker that Puppeteer can detect to know the test is complete (even with error)
|
||
|
|
resultDiv.innerHTML += '<p id="testComplete">Test completed with errors</p>'
|
||
|
|
}
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|