Attachment 350581 Details for Bug 189896 – Testcase

Testcase

invalidate-sourceAlpha.html (text/html), 1.15 KB, created by Simon Fraser (smfr) on 2018-09-23 12:28:39 PDT

(hide)

Description:

Filename:

MIME Type:

Creator: Simon Fraser (smfr)

Created: 2018-09-23 12:28:39 PDT

Size: 1.15 KB

patch

obsolete

><!DOCTYPE html>
><html>
><head>
>    <style>
>        .container {
>            width: 400px;
>            border: 20px solid blue;
>            filter: url(#filter);
>/*            -webkit-clip-path: inset(20px 10px 10px 10px);*/
>        }
>    
>        #box {
>            width: 100px;
>            height: 100px;
>            background-color: green;
>        }
>        
>        #box.moved {
>            margin-left: 300px;
>        }
>        </style>
>        <script>
>            window.addEventListener('load', () => {
>                setTimeout(() => {
>                    document.getElementById('box').classList.toggle('moved');
>                }, 500)
>            }, false);
>        </script>
></head>
><body>
>    <svg style="display: none">
>        <filter id="filter">
>            <femorphology operator="dilate" radius="10" in="SourceAlpha" result="morphology"></femorphology>
>            <femerge result="merge">
>                <femergenode in="morphology"></femergenode>
>                <femergenode in="SourceGraphic"></femergenode>
>            </femerge>
>        </filter>
>    </svg>
>
>    <div class="container">
>        <div id="box">
>        </div>
>    </div>
></body>
></html>
>

<!DOCTYPE html>
<html>
<head>
    <style>
        .container {
            width: 400px;
            border: 20px solid blue;
            filter: url(#filter);
/*            -webkit-clip-path: inset(20px 10px 10px 10px);*/
        }
    
        #box {
            width: 100px;
            height: 100px;
            background-color: green;
        }
        
        #box.moved {
            margin-left: 300px;
        }
        </style>
        <script>
            window.addEventListener('load', () => {
                setTimeout(() => {
                    document.getElementById('box').classList.toggle('moved');
                }, 500)
            }, false);
        </script>
</head>
<body>
    <svg style="display: none">
        <filter id="filter">
            <femorphology operator="dilate" radius="10" in="SourceAlpha" result="morphology"></femorphology>
            <femerge result="merge">
                <femergenode in="morphology"></femergenode>
                <femergenode in="SourceGraphic"></femergenode>
            </femerge>
        </filter>
    </svg>

    <div class="container">
        <div id="box">
        </div>
    </div>
</body>
</html>

Actions: View

Attachments on bug 189896: 350581