[jbosstools-issues] [JBoss JIRA] (JBIDE-10127) Resolve selector in open-on of style class in VPE

[Viacheslav Kabanovich (JIRA)]

    [ https://issues.jboss.org/browse/JBIDE-10127?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=12666914#comment-12666914 ] 

Viacheslav Kabanovich edited comment on JBIDE-10127 at 2/15/12 6:49 PM:
------------------------------------------------------------------------

1. There can be more than one attributes for node selector.
Rule
{code}
[title="y"][id="3"] p input.styleA {color: #FF0000}
{code}
says that some node should have both attributes title="y" and id="3".
Compare to the rule
{code}
[title="y"] [id="3"] p input.styleA {color: #FF0000}
{code}
that says that node should have title="y" and some its descendent should have id="3".

2. Algorithm that computes the best rule makes errors.
For example, if in stylesheet given in description, two last rules are switched:
{code}
    [title="y"] p input.styleA {color: #00CCFF}
    div p input.styleA {color: #CC00FF}
{code}
then last case in the example html will be incorrectly resolved.

The implemented comparing algorithm assumes that 'longer' CSSAxis[] is always preferable. That is not so. I think that the correct algorithm should compare 'restrictive strength' of the _last_ elements, then, if the last elements have the same strength, proceed to the previous, etc. 
The most important factor of strength of an axis element is the distance to ancestor that matches it. The element with the less distance is stronger no matter what its other strength factors are. Now this is not taken into account at all. So 'int distance' parameter should be added to CSSAxis and used in comparing. When corresponding elements are matching the same node, the 'restrictive strength' of the element may be illustrated by these examples:
{code}
div[title="y"][id="3] > [title="y"][id="3] > [title="y"] > div
div[title="m"][id="3] > div.styleX > div[title="m"]
{code}
That is
a) Attribute is stronger than node;
b) Two attributes are stronger than one attribute;
c) Class style attribute is stronger than any other attribute but weaker than two other attributes;
and so on.

                
      was (Author: scabanovich):
    1. There can be more than one attributes for node selector.
Rule
{code}
[title="y"][id="3"] p input.styleA {color: #FF0000}
{code}
says that some node should have both attributes title="y" and id="3".
Compare to the rule
{code}
[title="y"] [id="3"] p input.styleA {color: #FF0000}
{code}
that says that node should have title="y" and some its descendent should have id="3".

2. Algorithm that computes the best rule makes errors.
For example, if in stylesheet given in description, two last rules are switched:
{code}
    [title="y"] p input.styleA {color: #00CCFF}
    div p input.styleA {color: #CC00FF}
{code}
then last case in the example html will be incorrectly resolved.

The implemented comparing algorithm assumes that 'longer' CSSAxis[] is always preferable. That is not so. I think that the correct algorithm should compare 'restrictive power' of the first element, then proceed to the second, etc. The 'restrictive power' of the element may be illustrated by these examples
{code}
div[title="y"][id="3] > [title="y"][id="3] > [title="y"] > div
div.styleX > div[title="m"]


{code}
                  
> Resolve selector in open-on of style class in VPE
> -------------------------------------------------
>
>                 Key: JBIDE-10127
>                 URL: https://issues.jboss.org/browse/JBIDE-10127
>             Project: Tools (JBoss Tools)
>          Issue Type: Feature Request
>          Components: jsp/jsf/xml source editing
>    Affects Versions: 3.3.0.M3
>            Reporter: Viacheslav Kabanovich
>            Assignee: Viacheslav Kabanovich
>             Fix For: 3.3.0.Beta1
>
>
> EXECUTE: Create style sheet:
> {code}
>     .styleA {color: #FF0000}
>     .styleA .styleB {color: #FF8000}
>     div.styleA {color: #FF0080}
>     div[title="x"].styleA {color: #0000FF}
>     p input.styleA {color: #CCAA00}
>     div p input.styleA {color: #CC00FF}
>     [title="y"] p input.styleA {color: #00CCFF}
> {code}
> EXECUTE: Create html:
> {code}
> <html>
> <head>
> 	<title>Hello!</title> 
> 	<link href="stylesheet.css" rel="stylesheet" type="text/css"/>
> </head>
> <body>	
> 	<p class="styleA">
> 		.styleA {color: #FF0000}
> 	</p>	
> 	<p class="styleA">
> 		.styleA {color: #FF0000}
> 		<br/>
> 		<b class="styleB">.styleA .styleB {color: #FF8000}</b>
> 	</p>
> 	<div class="styleA">
> 		div.styleA {color: #FF0080}
> 	</div>	
> 	<div title="x" class="styleA">
> 		div[title="x"].styleA {color: #0000FF}
> 	</div>	
> 	<p>
> 		<input type="button" class="styleA" value="p input.styleA {color: #CCAA00}"/>
> 	</p>
> 	<div>
> 		<p>
> 			<input type="button" class="styleA" value="div p input.styleA {color: #CC00FF}"/>
> 		</p>
> 	</div>	
> 	<div title="y">
> 	  <div>
> 		<p>
> 			<input type="button" class="styleA" value="[title='y'] div p input.styleA {color: #00CCFF}"/>
> 		</p>
> 	  </div>
> 	</div>	
> </body>
> </html>
> {code}
> ASSERT: Style opened at each class="styleA" should be the same as text value in element.

--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators: https://issues.jboss.org/secure/ContactAdministrators!default.jspa
For more information on JIRA, see: http://www.atlassian.com/software/jira