[Webkit-unassigned] [Bug 102791] New: [Shadow DOM]: Error in retargeting algorithm

Tue Nov 20 04:04:09 PST 2012

https://bugs.webkit.org/show_bug.cgi?id=102791

           Summary: [Shadow DOM]: Error in retargeting algorithm
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: Unspecified
        OS/Version: Unspecified
            Status: UNCONFIRMED
          Severity: Normal
          Priority: P2
         Component: HTML DOM
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: sgrekhov at unipro.ru

According to the https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/shadow/index.html#event-retargeting-example for #player related target should be #player. But it isn't so in Chrome 23.0.1271.64 m. Run the following example:

<html>
<head>
<script type="text/javascript">

//Example taken from http://www.w3.org/TR/shadow-dom/#event-retargeting-example
function createTestMediaPlayer(d) {
    var SR = window.ShadowRoot || window.WebKitShadowRoot;

    d.body.innerHTML = '' +
    '<div id="player">' +        
        '<div id="player-shadow-root">' +
        '</div>' +
    '</div>';

    var playerShadowRoot = new SR(d.querySelector('#player-shadow-root'));
    playerShadowRoot.innerHTML = '' + 
        '<div id="controls">' +
            '<button class="play-button">PLAY</button>' +
            '<input type="range" id="timeline">' +
                '<div id="timeline-shadow-root">' +
                '</div>' +
            '</input>' +
            '<div class="volume-slider-container" id="volume-slider-container">' +
                '<input type="range" class="volume-slider" id="volume-slider">' +
                    '<div id="volume-shadow-root">' +                       
                    '</div>' +
                '</input>' +
            '</div>' +
        '</div>';

    var timeLineShadowRoot = new SR(playerShadowRoot.querySelector('#timeline-shadow-root'));
    timeLineShadowRoot.innerHTML =  '<div class="slider-thumb" id="timeline-slider-thumb"></div>';

    var volumeShadowRoot = new SR(playerShadowRoot.querySelector('#volume-shadow-root'));
    volumeShadowRoot.innerHTML = '<div class="slider-thumb" id="volume-slider-thumb"></div>';

    return {
        'playerShadowRoot': playerShadowRoot,
        'timeLineShadowRoot': timeLineShadowRoot,
        'volumeShadowRoot': volumeShadowRoot
        };
}

function test() {
    var d = document;

    roots = createTestMediaPlayer(d);

    //For #player relative target is #player
    d.querySelector('#player').addEventListener('click',            
       function (event) {
        alert('Relative target is ' + event.target.getAttribute('id'));
    }, false);

    var event = d.createEvent('HTMLEvents');
    event.initEvent ("click", true, false);
    roots.playerShadowRoot.querySelector('#volume-slider').dispatchEvent(event);
}
</script>
</head>
<body onload="test()">

</body>
</html>

This example shows relative target as #player-shadow-root but according to the https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/shadow/index.html#event-retargeting-example relative target should be #player

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.