Skip to content

Feature/code uploader#12

Open
Muniya-64bit wants to merge 37 commits intomainfrom
feature/code_uploader
Open

Feature/code uploader#12
Muniya-64bit wants to merge 37 commits intomainfrom
feature/code_uploader

Conversation

@Muniya-64bit
Copy link
Copy Markdown
Contributor

File uploder and Manager for obo code and obo blocks

  • After connecting we can acess files inside of esp 32 delete update

  • For testing for REPL use this Kind of one line code
    from machine import Pin; import time; led=Pin(2,Pin.OUT); exec("while True: led.value(not led.value()); time.sleep(0.5)")

- Fixed wrapper issues in code
- Added a scroll bar to code uploader
- Addded connet button
- So we can setup file manager easily in that way
- UI fixes in REPL
- Disconneted issue in ESP32
- Issues was in REPL conncetion lost while tab switching between UPLOADER and REPL
- Also colour changes in REPL
- currently can view files in esp32
- currently can download each file separatly
- Now user can view file content from esp32
- users can access each by swithcing tabs
- Users an get multiple tabs and code
- Also file manager view files using code editor
-
- Setup  a delay in file manager view ( enugh time to realese lock)
@Muniya-64bit Muniya-64bit requested a review from AnasSAV March 6, 2026 23:50
Comment thread cookies.txt
@@ -0,0 +1,4 @@
# Netscape HTTP Cookie File
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you remove this HTTP cookie file. Can you add .gitignore if not needed

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

@@ -0,0 +1,112 @@
/**
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this file also necessary. Can you add .gitignore if not needed. If we are adding test cases, can you write it down seperately

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

@@ -0,0 +1,303 @@
/**
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

WebSerialPortAdapter in manages its own reader/writer via startTransaction(). But SerialStreamManager already holds the exclusive reader/writer lock on the same port from the moment initialize() is called. Calling startTransaction() on the same port after SerialStreamManager is initialized would throw "stream is locked. This class is exported from the package index but is not used anywhere in the new code it's dead code that is also a landmine. Remove it or clearly mark it internal.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

if (typeof window === "undefined") return false;

const hasSerial = "serial" in navigator;
const isSecureContext =
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

window isSecureContext already returns true for localhost and https: in all modern browsers. The extra conditions are redundant.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

} finally {
// Don't close the port after upload - keep it for future uploads
// Only close if there was an error and no existing connection
if (!connectedPortRef.current && port) {
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Double cleanup risk In finally

But closePort calls serialStreamManager.cleanup() which clears the singleton regardless of which port is being closed. If a different port is connected at this point, the singleton gets wiped.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

@@ -0,0 +1,219 @@
/* ESP32 Uploader - Ant Design Component Overrides */
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why an overrides.css can we define the same css in global.css

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done

@AnasSAV
Copy link
Copy Markdown
Contributor

AnasSAV commented Mar 14, 2026

Feature Testing Rubric – ESP32 Code Uploader & File Manager

Feature Overview

Field Details
Feature Name ESP32 Code Uploader, REPL & Device File Manager
PR Number #12
Apps Covered OBO Blocks, OBO Code
Package Added @nexus-tools/esp32-uploader
Branch feature/code_uploader
Environment Development
Tested By @AnasSAV
Test Date 2026/03/14

Scoring Guide

Score Meaning
1 ✅ Satisfied
0 ❌ Unsatisfied
N/A Not Applicable

1. Requirements & UI Coverage

Page/App Criteria Functionality Review
OBO Blocks ESP32 connect button visible in output panel
OBO Blocks Upload code button uploads as main.py
OBO Blocks Device File Manager sidebar renders
OBO Blocks File manager collapses/expands correctly
OBO Blocks Main layout adjusts margin when sidebar collapses
OBO Blocks SharedCodePanel replaces old CodePanel
OBO Blocks Multi-tab editor renders
OBO Code ESP32 connect button visible in output panel
OBO Code Upload code button uploads as main.py
OBO Code Device File Manager sidebar renders
OBO Code REPL terminal renders when connected
OBO Code REPL connects automatically on device connect

2. Functional UI Testing

Connection Flow

Test Case Expected Behavior Functionality
Click Connect (Chrome/Edge, HTTPS/localhost) Browser serial port picker opens
Select device and confirm Status shows "Connected to ESP32"
Cancel port picker without selecting No error shown, status shows "cancelled"
Connect with device already in use by another app Shows user-friendly "device in use" error
Click Disconnect Port closes, file manager clears, REPL disconnects
Reconnect after disconnect Flow works again from scratch

Code Upload

Test Case Expected Behavior Score
Upload code while connected Progress bar advances 0→100%, success message
Upload with empty editor Shows "No code to upload" error
Upload without being connected Triggers connect flow first, then uploads
Upload while REPL is active Completes without "WritableStream is locked" error
Soft reset after upload ESP32 restarts and runs main.py

REPL Terminal (OBO Code)

Test Case Expected Behavior Score
REPL connects after device connect Shows "=== REPL Connected ==="
Type and run a Python expression Output appears below the input
Press Ctrl+C in REPL input Sends interrupt, shows ^C
Press Ctrl+D in REPL input Soft reset, shows ^D Soft reset
Click Clear button Output history clears
Run a slow command (>500ms) Output is not truncated
Run a multi-line statement Full output captured
Device disconnects mid-session REPL shows disconnected state, no crash

Device File Manager

Test Case Expected Behavior Score
Connect device File list populates automatically
Click Refresh File list re-fetches
Click open (file icon) on a .py file File opens in a new editor tab
Click Download on a file File downloads to local machine
Click Delete on a file Confirm dialog appears
Confirm delete File removed, list refreshes
Click "Save to Device" in code panel File saved to ESP32 (correct filename)
File manager shows active editor filename highlighted File currently open in editor is visually highlighted

Multi-Tab Code Editor

Test Case Expected Behavior Score
Default tab loads with existing code Main tab shows current code
Add new tab Empty tab created, editor clears
Close a tab Tab removed, adjacent tab becomes active
Cannot close last remaining tab Close button disabled on last tab
Open device file into editor New tab opens with file name and content
Open same file twice Switches to existing tab, no duplicate
Double-click tab to rename Inline rename input appears

3. ESP32 Communication Parity Check

Feature Expected Works Notes
Raw REPL file write Code written as main.py via Raw REPL Verify \x01 / \x04 / \x02 sequence
File listing (os.listdir) Returns name, size, isDir
File read (hex via binascii) Binary-safe download
File delete (os.remove) File removed from device
Ctrl-C interrupt Stops running code The UI needs to fixed Telling the code stopped Running
Ctrl-D soft reset Reboots device, runs main.py
Operation queue prevents stream locking Simultaneous upload + REPL doesn't crash Core SerialStreamManager guarantee

4. Input Validation & Edge Cases

Scenario Expected Behavior Score Review
Upload very large file (>50KB) No timeout, completes successfully ⚠️ Raw REPL 8s timeout may be insufficient
File with special characters in name Path properly escaped in Python ⚠️ Check escapePath() in use-esp32-file-manager.ts
Code containing single quotes JSON.stringify escaping prevents Python syntax error ⚠️ See writeFileToESP32 in use-esp32-serial.ts
Code containing backslashes Escaped correctly in main.py
Device unplugged mid-upload Clean error shown, state reset
Page refresh while connected Port state is cleaned up (no zombie lock)
Two upload operations triggered rapidly Queue serialises them, no crash

5. Browser & Device Compatibility

Browser / Context Web Serial Supported Upload Works REPL Works Overall
Chrome
Edge

6. Performance Testing

Metric Target OBO Blocks OBO Code
Initial page load with sidebar < 3s
File list fetch from device < 5s
Upload 10KB file < 10s
REPL response to simple expression < 1s
Tab switch in multi-tab editor < 100ms

7. Critical Issues from Code Review

Issue Severity Test Status Notes
cookies.txt committed to repo 🚨 Critical Must be removed + added to .gitignore before merge
test-stream-sharing.js committed ⚠️ Medium Debug file should not be in repo
WebSerialPortAdapter conflicts with SerialStreamManager 🚨 Critical web-serial-adapter.ts — dead code exported publicly; startTransaction() will throw "stream locked" if used alongside SerialStreamManager
ESP32FileManager is a duplicate of DeviceFileManagerSidebar ⚠️ Medium Exported from package but unused in apps — dead public API
serialStreamManager singleton exported publicly ⚠️ Medium Bypasses hook layer; should be internal to package
useEffect in ESP32REPL suppresses doConnect dependency ⚠️ Medium ESP32REPL.tsx:97eslint-disable-line hides stale closure risk
SharedCodeEditor default tab hardcoded to "test.py" ⚠️ Medium shared-code-editor.tsx:57 — placeholder name leaks to users
closePort calls serialStreamManager.cleanup() unconditionally ⚠️ Medium use-esp32-uploader.ts — wipes singleton even if a different port is active

8. UI Issues

Not Mobile/Tab Responsive

  • Can you add a button to stop the code running in ESP32
  • Can you use shadcn button for overall
  • Ctrl + C stops running code in ESP32 but there is not notification for it
  • Make the panels adjustable so the user can adjust panel width according to his needs

Tester Sign-off

Name Role
@AnasSAV QA Engineer
@Muniya-64bit Developer

@Muniya-64bit
Copy link
Copy Markdown
Contributor Author

  • Added button for esp32 run but we will update button using shadcn or anyway after defining UI

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants