`zorder` on overlayed subplots case of multiple traces in each subplot

[stephprobst]

The in plotly.js 2.34.0 introduced zorder property does not work as expected. The following chart demonstrates the issue:

https://codepen.io/Djeramon/pen/VwJPXGr

The orange line is drawn on top, but it should be drawn behind the green and red line.

The issue seems to be related to the traces being linked to different y-axes. Once the axes are being linked to the same y-axis, the bug disappears.

[archmoj]

Thanks for the report. This is a bug.

[archmoj]

@stephprobst in your codepen the third trace has a name saying the zorder is 3; but its zorder is actually is set to 2.
Since this is confusing, I thought you may want to adjust that?

[stephprobst]

@archmoj : You're right. Thanks. I corrected it.

[archmoj]

Thanks @stephprobst.
It looks like if you drop barmode: 'stack' or use barmode: 'overlay' or barmode: 'group'; the issue is still present.
Please confirm.

[stephprobst]

@archmoj : Yes, I can confirm. The problem doesn't seem to be related to the used barmode.

[archmoj]

@stephprobst I'm trying to replicate this issue by tweaking one of the minimal mocks we used for zorder and overlayed axis.
This codepen works as expected while using bars for first two traces and z order values similar to what you have in your original codepen.
Could you possibly help find what should be changed so that the bug appears?

[stephprobst]

@archmoj : The problem sits with the assignment of the bars to the y-axes. If you remove all assignment information, the bug appears. In your current codepen version:

  {
   "type": "bar",
   "x": ["A", "B", "C", "D"],
   "y": [1, 2, 3, 4],
   "zorder": 1
  },
  {
   "type": "bar",
   "width": 0.6,
   "x": ["A", "B", "C", "D"],
   "y": [2, 3, 4, 1],
   "zorder": 2
  },

[archmoj]

OK. So this is not related to combinations of bars and scatter as well.
Here is a minimal codepen which uses scatter traces only to help introduce this bug.
@stephprobst Please confirm.