Test case for jQuery Ticket 7978

fadeIn in Chrome fails

HTML

<ul>
    <li class="foo">
        <span class="bar">Html Css</span>
        <!-- adding other non-floated nodes to the list item makes it work -->
    </li>
</ul>

CSS

.foo { overflow: hidden; } /* clearing the float fixes it */
.bar {
    padding: 5px;
    background-color: orange;
    
    /* removing float makes it work */
    float: left;
    
    /* setting default opacity to a value other than 1 makes it work
    opacity: 0.99; */
}

/* changing display mode to block or inline-block instead of list-item makes it work
.foo { display: block; } */

JavaScript

$('.foo').css({'display':'block'});
$('.foo').hide();
$('.foo').fadeIn(1000);