bug: Calling the function: penpot.replaceColor(shapes: Shape[], oldColor: Color, newColor: Color) triggers an Internal Error

[LloydNA]

Steps To Reproduce

1. Define two colors (color1 and color2) in the local library of a project LibraryColor.
2. Using the Penpot plugin API, get all the children Shapes of the root of the project with penpot.root.children
3. Get the two colors previously defined in the local library with penpot.library.local.colors
4. Try to change all the colors (fill, stroke, etc) with penpot.replaceColor(childShapes, color1, color2)

Expected behavior

All references to color1 in all the children shapes of the root of the design should be changed to color2

Actual behavior

An internal server error (with a report file) is displayed in the frontend
report.txt

Screenshots or video

Desktop (please complete the following information)

• OS: MacOS Sequoia 15.0.1
• Browser: Firefox Dev edition 133.0b5

Smartphone (please complete the following information)

No response

Environment (please complete the following information)

• Self Hosted: (Docker) Debian 12
• Host: https://design.penpot.app/

Frontend Stack Trace

Hint:    No matching clause: 
Prof ID: a5adc15f-fb38-8092-8005-3959c8def840
Team ID: a5adc15f-fb38-8092-8005-3959c8df216f

Data:
{:hint "No matching clause: "}

Trace:
u@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099:3434:42
PENPOT.Ifc/NY.prototype.ma/<@https://design.penpot.app/js/main.33d51a51d-1730738783.js:2754:404
PENPOT.ERa/<@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:4347:75
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:221:227
d@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:150:99
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:159:12
shadow$provide[1]/m/<@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:151:498
_trySubscribe@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:161:85
subscribe@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:161:25
shadow$provide[43]/n.map/</<@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:221:172
_trySubscribe@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:161:85
subscribe@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:161:25
v@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:243:286
q@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:243:218
d@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:150:99
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:159:12
t@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:152:277
shadow$provide[1]/k/<@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:151:314
_trySubscribe@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:161:85
subscribe@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:161:25
shadow$provide[62]/n.mergeInternals@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:244:42
shadow$provide[63]/n.mergeMap/</<@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:245:210
_trySubscribe@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:161:85
subscribe@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:161:25
shadow$provide[98]/a/</<@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:286:105
_trySubscribe@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:161:85
subscribe@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:161:25
PENPOT.Qw@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:4351:470
PENPOT.Rw@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:4352:230
b@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:6991:109
@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:6992:463
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:160:105
_next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:159:302
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:159:12
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:171:42
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:348:198
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:160:105
_next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:159:302
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:159:12
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:363:301
d@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:150:99
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:159:12
next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:171:42
y.next@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:6993:38
sM.J@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:6980:442
PENPOT.Z.j@https://design.penpot.app/js/shared.33d51a51d-1730738783.js:6995:395
PENPOT.g.replaceColor@https://design.penpot.app/js/main.33d51a51d-1730738783.js:4723:440
replaceColor@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099:8007:46
Ml/get/<@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099:8095:21
t/<@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099 line 2918 > Function line 12 > eval:1:297
t@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099 line 2918 > Function line 12 > eval:1:264
t/<@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099 line 2918 > Function line 12 > eval:1:356
t@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099 line 2918 > Function line 12 > eval:1:328
t/<@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099 line 2918 > Function line 12 > eval:1:356
t@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099 line 2918 > Function line 12 > eval:1:328
@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099 line 2918 > Function line 12 > eval:1:613
$l/sendMessage/<@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099:7877:25
sendMessage@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099:7877:9
@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099:8230:16
EventListener.handleEvent*@https://design.penpot.app/plugins-runtime/index.js?ts=1730739141099:8227:8


Last events:
[":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.undo/start-undo-transaction"
 ":app.main.data.workspace.colors/change-color-in-selected"
 ":app.main.data.workspace.colors/stop-picker"
 ":app.main.data.modal/hide-modal"
 ":app.main.data.notifications/hide"
 ":app.main.data.workspace.notifications/finalize"
 ":app.main.data.workspace.shape-layout/finalize"
 ":app.main.data.workspace/finalize-file"
 ":app.main.data.workspace/finalize-page"
 ":app.main.data.shortcuts/pop-shortcuts"
 ":app.main.data.events/event"
 ":app.main.data.workspace.undo/check-open-transactions"
 ":app.main.data.plugins/remove-current-plugin"
 ":app.main.data.workspace.undo/check-open-transactions"]

Backend Stack Trace

No response

Additional context

Code Snippet:

  if(message === "change-color"){
    const color1 = penpot.library.local.colors[0]
    const color2 = penpot.library.local.colors[1]
    
    if(penpot.root && "children" in penpot.root)
      penpot.replaceColor(penpot.root.children, color1, color2)
  }

P.D: This might not be a bug at all and just some kind of issue because I'm treating a LibraryColor as a Color, or something like that.
If that is the case, is there any place where I can see an usage example of this method?, the documentation of it is short and doesn't give a clear explanation of how to really use it :(

[madalenapmelo-kp]

Hi @LloydNA,

Thanks for reporting this! We've added this to our backlog on Taiga so that we can look further into it, you can find the details here: https://tree.taiga.io/project/penpot/issue/9371