[Bug] Design Export Produces Incorrect Layer Order - Z-index Not Preserved

[anshul23102]

Description

Exporting designs as PNG/SVG produces incorrect layer ordering. Z-index information lost during export. Foreground elements appear behind background elements.

Steps to Reproduce

1. Create design with intentional layer ordering
2. Layer 1 (back): Rectangle (blue)
3. Layer 2 (front): Circle (red) on top
4. Export to PNG/SVG
5. Exported image shows Circle behind Rectangle (reversed)

Environment Information

• Framework: Design export service
• Format: PNG/SVG export
• Issue: Z-index/layer order
• Version: Current main branch

Expected Behavior

Export preserves exact layer order from canvas. Z-index values respected. Foreground stays foreground.

Actual Behavior

File: services/exportService.js
Z-index not included in export process. Layers exported in arbitrary order.

Code Reference

File: services/exportService.js
Missing: Z-index ordering in SVG/PNG generation

Additional Context

Include z-index in export:

const sortedLayers = layers.sort((a,b) => a.zIndex - b.zIndex);
// Use sorted order for rendering

GSSoC Points Estimate: Level 1 (Bug/Export)

Suggested Labels

• gssoc:approved
• type:bug
• severity:medium
• area:export

[aaniya22]

pls assign this to me under gssoc