filterText is the text that is written in the textinput, it is captured by the bead, ... the only thing that occurs to me is that they could "paste code" in the textinput but the truth is that I have added it but I am not sure about it either.
Hiedra -----Mensaje original----- De: Josh Tynjala <joshtynj...@bowlerhat.dev> Enviado el: martes, 22 de julio de 2025 22:18 Para: dev@royale.apache.org Asunto: Re: (royale-asjs) branch develop updated: fix: use innerHTML instead of text in Jewel SearchFilterForList text doesn't render HTML, preventing styling with useDecoration. innerHTML enables proper CSS markup. Looks good to me. I'm not sure that this is necessary: sanitizeHtml(filterText) Unless I missed that the filterText is actually being added to the innerHTML. -- Josh Tynjala Bowler Hat LLC https://bowlerhat.dev/ On Tue, Jul 22, 2025 at 11:05 AM Maria José Esteve <mjest...@iest.com> wrote: > @Harb, @Josh What do you think about this? > > COMPILE::JS > { > //decorate text > if(useDecoration) > { > var securetxt:String = sanitizeHtml(textData); > var securefiltertxt:String = sanitizeHtml(filterText); > var txt:String = "<span style='display:contents;'>" + > (securefiltertxt != "" ? decorateText(securetxt, > securetxt.toUpperCase().indexOf(securefiltertxt.toUpperCase()), > securefiltertxt.length) : securetxt ) + "</span>"; > var a:UIBase = ir as UIBase; > (ir as UIBase).element.innerHTML = txt; > } > } > > Hiedra > > -----Mensaje original----- > De: Maria José Esteve <mjest...@iest.com> > Enviado el: martes, 22 de julio de 2025 19:32 > Para: dev@royale.apache.org > Asunto: RE: (royale-asjs) branch develop updated: fix: use innerHTML > instead of text in Jewel SearchFilterForList text doesn't render HTML, > preventing styling with useDecoration. innerHTML enables proper CSS markup. > > Sorry, I forgot to translate... > I tested it with the generated HTML: > - This was my first test: > > //decorate text > { > var txt:String = "<span style='display:contents;'>" + (filterText > != "" ? decorateText(textData, > textData.toUpperCase().indexOf(filterText.toUpperCase()), > filterText.length) : textData ) + "</span>"; > COMPILE::JS > { > var a:UIBase = ir as UIBase; > (ir as UIBase).element.innerHTML = sanitizeHtml(txt); > //*** Removes "decorateText" transformations > } > } > > @Josh do you mean I could make it safe by passing sanitizeHtml to > textData? (I also think that's the solution): > > COMPILE::JS > { > if(useDecoration) > { > var secureTxt:String = sanitizeHtml(textData); > var txt:String = "<span style='display:contents;'>" + > (filterText != "" ? decorateText(secureTxt, > secureTxt.toUpperCase().indexOf(filterText.toUpperCase()), > filterText.length) : secureTxt ) + "</span>"; > var a:UIBase = ir as UIBase; > (ir as UIBase).element.innerHTML = txt; > } > } > > > Hiedra > > -----Mensaje original----- > De: Maria José Esteve <mjest...@iest.com> Enviado el: martes, 22 de julio > de 2025 19:22 > Para: dev@royale.apache.org > Asunto: RE: (royale-asjs) branch develop updated: fix: use innerHTML > instead of text in Jewel SearchFilterForList text doesn't render HTML, > preventing styling with useDecoration. innerHTML enables proper CSS markup. > > Lo probé con el HTML generado: > > Esta fue mi primera prueba: > //decorate text > { > var txt:String = "<span style='display:contents;'>" + (filterText > != "" ? decorateText(textData, > textData.toUpperCase().indexOf(filterText.toUpperCase()), > filterText.length) : textData ) + "</span>"; > COMPILE::JS > { > var a:UIBase = ir as UIBase; > (ir as UIBase).element.innerHTML = sanitizeHtml(txt); > //*** Elimina las transformaciones "decorateText" > } > } > > @Josh ¿te refieres a que podría hacerlo seguro pasándole el sanitizeHtml a > textData?: > > //decorate text > if(useDecoration) > { > var secureTxt:String = sanitizeHtml(textData); > var txt:String = "<span style='display:contents;'>" + (filterText > != "" ? decorateText(secureTxt, > secureTxt.toUpperCase().indexOf(filterText.toUpperCase()), > filterText.length) : secureTxt ) + "</span>"; > COMPILE::JS > { > var a:UIBase = ir as UIBase; > (ir as UIBase).element.innerHTML = txt; > } > } > > Hiedra > > -----Mensaje original----- > De: Josh Tynjala <joshtynj...@bowlerhat.dev> Enviado el: martes, 22 de > julio de 2025 18:46 > Para: dev@royale.apache.org > Asunto: Re: (royale-asjs) branch develop updated: fix: use innerHTML > instead of text in Jewel SearchFilterForList text doesn't render HTML, > preventing styling with useDecoration. innerHTML enables proper CSS markup. > > Did you try calling sanitizeHTML() on your entire generated HTML? Or were > you more specific? It seems to me that you should pass only textData to > sanitizeHTML(). You know that the HTML that you generate in > SearchFilterForList is safe, but textData is the part that is potentially > insecure. > > -- > Josh Tynjala > Bowler Hat LLC > https://bowlerhat.dev/ > > > On Tue, Jul 22, 2025 at 9:37 AM Maria José Esteve <mjest...@iest.com> > wrote: > > > Hi Harb, > > Does this pose a security risk? Well, in principle, the HTML is > > generated by the same bead with the text to be rendered (it adds CSS > > for the highlighting to be displayed). > > In an initial test, I tried including the sanitizeHTML function, but > > it removed the CSS rules, so it wasn’t usable. > > > > Do you think this is a security concern? If so… how could I implement > > it differently? > > > > Hiedra. > > > > -----Mensaje original----- > > De: Harbs <harbs.li...@gmail.com> > > Enviado el: martes, 22 de julio de 2025 16:16 > > Para: Apache Royale Development <dev@royale.apache.org> > > Asunto: Re: (royale-asjs) branch develop updated: fix: use innerHTML > > instead of text in Jewel SearchFilterForList text doesn't render HTML, > > preventing styling with useDecoration. innerHTML enables proper CSS > markup. > > > > Where is the contents of “txt” coming from. Is using innerHTML a > > security risk? > > > > > On Jul 22, 2025, at 5:35 AM, hie...@apache.org wrote: > > > > > > This is an automated email from the ASF dual-hosted git repository. > > > > > > hiedra pushed a commit to branch develop in repository > > > https://gitbox.apache.org/repos/asf/royale-asjs.git > > > > > > > > > The following commit(s) were added to refs/heads/develop by this push: > > > new 15edae07a8 fix: use innerHTML instead of text in Jewel > > SearchFilterForList text doesn't render HTML, preventing styling with > > useDecoration. innerHTML enables proper CSS markup. > > > 15edae07a8 is described below > > > > > > commit 15edae07a8ed5db132cb8cf55424004af73510c0 > > > Author: hiedra <mjest...@iest.com> > > > AuthorDate: Tue Jul 22 04:36:14 2025 +0200 > > > > > > fix: use innerHTML instead of text in Jewel SearchFilterForList > > > text doesn't render HTML, preventing styling with useDecoration. > > innerHTML enables proper CSS markup. > > > > > > Closes #1253 > > > --- > > > .../jewel/beads/controls/textinput/SearchFilterForList.as | 13 > > +++++++++++-- > > > 1 file changed, 11 insertions(+), 2 deletions(-) > > > > > > diff --git > > > a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ > > > be ads/controls/textinput/SearchFilterForList.as > > > b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ > > > be ads/controls/textinput/SearchFilterForList.as > > > index b684b84a7e..b91c4cd9d6 100644 > > > --- > > > a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/ > > > be ads/controls/textinput/SearchFilterForList.as > > > +++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/je > > > +++ we l/beads/controls/textinput/SearchFilterForList.as > > > @@ -36,6 +36,10 @@ package > > org.apache.royale.jewel.beads.controls.textinput > > > import > > org.apache.royale.jewel.supportClasses.list.IListPresentationModel; > > > import > > org.apache.royale.jewel.supportClasses.textinput.TextInputBase; > > > import org.apache.royale.utils.sendEvent; > > > + COMPILE::JS > > > + { > > > + import org.apache.royale.core.UIBase; > > > + } > > > > > > /** > > > * The SearchFilterForList bead class is a specialty bead > > > that > > can > > > be used with @@ -321,8 +325,13 @@ package > > org.apache.royale.jewel.beads.controls.textinput > > > //decorate text > > > if(useDecoration) > > > { > > > - ir.text = "<span > > style='display:contents;'>" + (filterText != "" ? > > decorateText(textData, > > textData.toUpperCase().indexOf(filterText.toUpperCase()), > > filterText.length) : textData ) + "</span>"; > > > - } > > > + var txt:String = > > > + "<span > > style='display:contents;'>" + (filterText != "" ? > > decorateText(textData, > > textData.toUpperCase().indexOf(filterText.toUpperCase()), > > filterText.length) : textData ) + "</span>"; > > > + COMPILE::JS > > > + { > > > + var a:UIBase = > > > + ir > > as UIBase; > > > + (ir as > > UIBase).element.innerHTML = txt; > > > + } > > > + } > > > } else { > > > ir.visible = false; > > > } > > > > > > > >
