<html>
<script>
    if (window.layoutTestController)
        layoutTestController.dumpAsText();
</script>
<body>
    
    <div id="result"></div>
    
    <!-- Test radio/checkbox without labels -->
    <input type="radio" name="r1" id="r1">Test<br>
    <input type="checkbox" name="cb1" id="cb1">Test<br>
    
    <!-- Test radio/checkbox with labels -->
    <input type="radio" name="r2" id="r2"><label for="r2">This is a long test label that should be included in the size of this object</label><br>
    <input type="checkbox" name="cb2" id="cb2"><label for="cb2">This is a long test label that should be included in the size of this object</label><br>

     
    <script>
        if (window.accessibilityController) {
            var result = document.getElementById("result");

            // radio button 1
            var r1 = document.getElementById("r1");
            r1.focus();
            var focusedElement = accessibilityController.focusedElement;
            var width = focusedElement.width;
            var height = focusedElement.height;

            result.innerText += "Radio1: ";
            if (width <= 0 || height <= 0) {
                result.innerText += "Fail";
            } else {
                result.innerText += "Pass";            
            }
            result.innerText += "\n";

            // check box 1
            var cb1 = document.getElementById("cb1");
            cb1.focus();
            focusedElement = accessibilityController.focusedElement;
            width = focusedElement.width;
            height = focusedElement.height;

            result.innerText += "Checkbox1: ";
            if (width <= 0 || height <= 0) {
                result.innerText += "Fail";
            } else {
                result.innerText += "Pass";            
            }
            result.innerText += "\n";

            // radio button with label (width should be more than 100 px)
            var cb1 = document.getElementById("r2");
            cb1.focus();
            focusedElement = accessibilityController.focusedElement;
            width = focusedElement.width;
            height = focusedElement.height;

            result.innerText += "Radio2: ";
            if (width <= 100 || height <= 0) {
                result.innerText += "Fail";
            } else {
                result.innerText += "Pass";            
            }
            result.innerText += "\n";

            // checkbox with label (width should be more than 100 px)
            var cb1 = document.getElementById("cb2");
            cb1.focus();
            focusedElement = accessibilityController.focusedElement;
            width = focusedElement.width;
            height = focusedElement.height;

            result.innerText += "Checkbox2: ";
            if (width <= 100 || height <= 0) {
                result.innerText += "Fail";
            } else {
                result.innerText += "Pass";            
            }
            result.innerText += "\n";

        }
    </script>
</body>
</html>