The arrow doesn't draw if you define a CSS style for the InteractionDialog

[ThomasH99]

Describe the bug
The arrow doesn't draw if you define a CSS style for the InteractionDialog.

Your support indicated this may be due to a regression in the CSS parser.

(tested on Simulator)

Here’s my test code:

Form hi = new Form("InteractionDialog", BoxLayout.y());
TextArea textArea = new TextArea("some text");
hi.add(textArea);
hi.show();
InteractionDialog id = new InteractionDialog();
id.setTitle("TitleX");

id.showPopupDialog(textArea);

When I run without any css styling I get this (simulator) with a white arrow:

When I add this to the css:
PopupDialog {
background-color: lightblue;
border-radius: 1mm;
margin: 0px;
padding: 2mm;
}

I get this without the arrow:

So, it seems the issue is with CN1 and not my code?

Also, if I remove the PopupDialog definition from css and save it again (so the Simulator reloads the css), it updates the color and size of the popup (and leaves space for the arrow), but does NOT add the arrow:

[Eric-Chomba]

I realized this too when trying to customize PopupDialog in CSS. When you add border-radius attribute, the arrow of the Popup disappear. You can remove border-radius in CSS for the arrow to show.

…

On Sat, Mar 16, 2024, 00:52 ThomasH99 ***@***.***> wrote: *Describe the bug* The arrow doesn't draw if you define a CSS style for the InteractionDialog. Your support indicated this may be due to a regression in the CSS parser. (tested on Simulator) Here’s my test code: Form hi = new Form("InteractionDialog", BoxLayout.y()); TextArea textArea = new TextArea("some text"); hi.add(textArea); hi.show(); InteractionDialog id = new InteractionDialog(); id.setTitle("TitleX"); id.showPopupDialog(textArea); When I run without any css styling I get this (simulator) with a white arrow: PastedGraphic-4.png (view on web) <https://github.com/codenameone/CodenameOne/assets/16265939/838f2c65-876a-4c00-b22e-11a8673906f5> When I add this to the css: PopupDialog { background-color: lightblue; border-radius: 1mm; margin: 0px; padding: 2mm; } I get this without the arrow: PastedGraphic-5.png (view on web) <https://github.com/codenameone/CodenameOne/assets/16265939/987d37a1-93eb-45cc-aeaf-c6f581bfc6a5> So, it seems the issue is with CN1 and not my code? Also, if I remove the PopupDialog definition from css and save it again (so the Simulator reloads the css), it updates the color and size of the popup (and leaves space for the arrow), but does NOT add the arrow: PastedGraphic-6.png (view on web) <https://github.com/codenameone/CodenameOne/assets/16265939/462e0708-8f70-4601-8b44-b5933481c693> — Reply to this email directly, view it on GitHub <#3798>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ALVUTVU77WNPKNDZHW7L5DLYYNUQ3AVCNFSM6AAAAABEYWRXAOVHI2DSMVQWIX3LMV43ASLTON2WKOZSGE4DSNJSGA2TSMQ> . You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>

[ThomasH99]

Thanks Eric! You’re right that removing the border-radius brings the arrow back, but it seems that it leads to ignoring remaining of the CSS definition (e.g. the background-color).

…

On 17 Mar 2024, at 13:08, Eric ***@***.***> wrote: I realized this too when trying to customize PopupDialog in CSS. When you add border-radius attribute, the arrow of the Popup disappear. You can remove border-radius in CSS for the arrow to show. On Sat, Mar 16, 2024, 00:52 ThomasH99 ***@***.***> wrote: > *Describe the bug* > The arrow doesn't draw if you define a CSS style for the InteractionDialog. > > Your support indicated this may be due to a regression in the CSS parser. > > (tested on Simulator) > > Here’s my test code: > > Form hi = new Form("InteractionDialog", BoxLayout.y()); > TextArea textArea = new TextArea("some text"); > hi.add(textArea); > hi.show(); > InteractionDialog id = new InteractionDialog(); > id.setTitle("TitleX"); > > id.showPopupDialog(textArea); > > When I run without any css styling I get this (simulator) with a white > arrow: > PastedGraphic-4.png (view on web) > <https://github.com/codenameone/CodenameOne/assets/16265939/838f2c65-876a-4c00-b22e-11a8673906f5> > > When I add this to the css: > PopupDialog { > background-color: lightblue; > border-radius: 1mm; > margin: 0px; > padding: 2mm; > } > > I get this without the arrow: > PastedGraphic-5.png (view on web) > <https://github.com/codenameone/CodenameOne/assets/16265939/987d37a1-93eb-45cc-aeaf-c6f581bfc6a5> > > So, it seems the issue is with CN1 and not my code? > > Also, if I remove the PopupDialog definition from css and save it again > (so the Simulator reloads the css), it updates the color and size of the > popup (and leaves space for the arrow), but does NOT add the arrow: > PastedGraphic-6.png (view on web) > <https://github.com/codenameone/CodenameOne/assets/16265939/462e0708-8f70-4601-8b44-b5933481c693> > > — > Reply to this email directly, view it on GitHub > <#3798>, or unsubscribe > <https://github.com/notifications/unsubscribe-auth/ALVUTVU77WNPKNDZHW7L5DLYYNUQ3AVCNFSM6AAAAABEYWRXAOVHI2DSMVQWIX3LMV43ASLTON2WKOZSGE4DSNJSGA2TSMQ> > . > You are receiving this because you are subscribed to this thread.Message > ID: ***@***.***> > — Reply to this email directly, view it on GitHub <#3798 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AD4DFUYFKIVY5FRCN5AMUMLYYWBVRAVCNFSM6AAAAABEYWRXAOVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDAMBSGQZTGNBTGY>. You are receiving this because you authored the thread.

[shannah]

Fixed. Will be part of next update on friday.