Toggling SVG pattern fill problem with Webkit browsers

I'm having problems with Webkit browsers (e.g., Chrome, Safari) and changing patterned fills in SVG objects. The example below tries to toggle the fill of a rectangle between a solid red and the google logo on hover:

<svg xmlns="http://www.w3.org/2000/svg" version="1开发者_C百科.1">
    <defs>
        <pattern id="img1" patternUnits="userSpaceOnUse" width="275" height="95">
            <image xlink:href="http://www.google.com/intl/en_com/images/srpr/logo3w.png" x="0" y="0" width="275" height="95" />
        </pattern>
    </defs>
    <rect id="rect" width="550" height="190" style="fill:url(#img1);stroke-width:1;stroke:rgb(0,0,0)">
        <set attributeName="fill" from="url(#img1)" to="red" begin="mouseover" end="mouseout"/>
    </rect>
</svg>

In Chrome/Safari, the rectangle correctly fills the rectangle with the google logo pattern on load. On mouse over, the rectangle fill switches to red. On mouse out, the fill appears as white rather than swapping back to the google logo.