I am encountering several errors while running my Figma plugin, which converts websites into editable Figma designs. The plugin fetches website content, processes HTML and CSS, and transforms it into Figma components while preserving styles, layout, and assets. However, I am facing manifest permission issues and syntax errors, which are preventing the plugin from functioning correctly.
here is the project url - https://github.com/aditya-sphereoutsourcing/figma-htmlui
Error Details
-
Manifest Errors
- Invalid permission specified: currentPage
- Invalid value for networkAccess. If you want to allow all domains, please add a "reasoning" field to the networkAccess object.
-
Syntax Error in Vendor Core File
pgsql
CopyEdit
Syntax error on line 52: Unexpected token . parsed.textContent = element.textContent?.trim(); ^
-
Multiplayer Session Connection Issues
- The console repeatedly logs
[MultiplayerSession] connecting to wss://www.figma.com/api/multiplayer/...
, followed by multiple reconnect attempts.
- The console repeatedly logs
Workflow & Where the Error Occurs
🔄 Backend Process Flow
-
Initial Request Processing
figma.ui.onmessage
listens for a message when the user requests a website conversion.- The plugin fetches the website's content using
fetch(msg.url)
.
-
HTML Parsing (src/parsers/htmlParser.ts)
- Converts the raw HTML into a structured DOM tree.
- Extracts properties, styles, and attributes.
- Handles special elements (like images, SVGs).
-
CSS Processing (src/parsers/cssParser.ts)
- Extracts CSS rules and computes styles.
- Resolves shorthand properties and media queries.
-
Style Conversion (src/utils/styleConverter.ts)
- Converts CSS properties to Figma-compatible formats.
- Handles unit conversions (px, rem, em).
-
Figma Node Creation (src/utils/figmaUtils.ts)
- Creates corresponding Figma nodes.
- Applies styles, layout, and constraints.
🛠️ Where the Error Occurs
- The manifest errors occur when Figma attempts to validate permissions.
- The syntax error (
Unexpected token .
) happens in a minified vendor core file, possibly due to unsupported optional chaining (?.
). - The Multiplayer Session reconnect loop suggests an issue with WebSocket connectivity to Figma’s API.
🛠️ Steps Taken to Resolve
- Verified
manifest.json
to ensure correct permissions forcurrentPage
andnetworkAccess
. - Checked if the optional chaining (
?.
) is causing compatibility issues with the Figma plugin environment. - Attempted to reconnect manually, but WebSocket disconnections persist.
Could you please provide guidance on resolving these issues? Your help would be greatly appreciated!