<!DOCTYPE HTML>
<head>
    <style>
        div {
            width: 130px;
            height: 130px;
            background-color: green;
            float: left;
            margin: 5px;
        }
    </style>
    <script type="text/javascript">
        if (window.testRunner)
            window.testRunner.waitUntilDone();

        var blueWhite1px400msGif = "url('data:image/gif;base64,R0lGODlhAQABAJECAP///wAt0v///wAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQJKAACACwAAAAAAQABAAACAkwBACH5BAkoAAIALAAAAAABAAEAAAICRAEAOw==')";

        window.onload = function () {
            var list = document.getElementsByTagName('div');
            for (var i = 0; i < list.length; i++)
                list[i].style.backgroundImage = blueWhite1px400msGif;
            setTimeout(function () {
                if (window.testRunner)
                    window.testRunner.notifyDone();
            }, 500);
        };
    </script>
</head>
<!-- This file should contain a gif on top of a background color with every type of blending. -->
<body>
    <div style="background-blend-mode: normal, normal"></div>
    <div style="background-blend-mode: multiply, normal"></div>
    <div style="background-blend-mode: screen, normal"></div>
    <div style="background-blend-mode: darken, normal"></div>
    <div style="background-blend-mode: lighten, normal"></div>
    <div style="background-blend-mode: color-dodge, normal"></div>
    <div style="background-blend-mode: color-burn, normal"></div>
    <div style="background-blend-mode: hard-light, normal"></div>
    <div style="background-blend-mode: soft-light, normal"></div>
    <div style="background-blend-mode: difference, normal"></div>
    <div style="background-blend-mode: exclusion, normal"></div>
</body>
