tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

layout-comparison.js (4567B)

      1 function getWritingMode(element, reference) {
      2    var style = window.getComputedStyle(reference);
      3    if (style.getPropertyValue("writing-mode") !== "horizontal-tb" ||
      4        style.getPropertyValue("direction") !== "ltr")
      5        throw "Reference should have writing mode horizontal-tb and ltr";
      6 
      7    style = window.getComputedStyle(element);
      8    var param =  {
      9        rtl: style.getPropertyValue("direction") === "rtl",
     10        mode: style.getPropertyValue("writing-mode")
     11    };
     12 
     13    return param;
     14 }
     15 
     16 function compareSize(element, reference, epsilon) {
     17    var param = getWritingMode(element, reference);
     18    var elementBox = element.getBoundingClientRect();
     19    var referenceBox = reference.getBoundingClientRect();
     20 
     21    switch(param.mode) {
     22    case "horizontal-tb":
     23        assert_approx_equals(elementBox.width, referenceBox.width, epsilon,
     24                             "inline size");
     25        assert_approx_equals(elementBox.height, referenceBox.height, epsilon,
     26                             "block size");
     27        break;
     28    case "vertical-lr":
     29    case "vertical-rl":
     30        assert_approx_equals(elementBox.width, referenceBox.height, epsilon,
     31                             "inline size");
     32        assert_approx_equals(elementBox.height, referenceBox.width, epsilon,
     33                             "block size");
     34        break;
     35    default:
     36        throw "compareSize: Unrecognized writing-mode value";
     37    }
     38 }
     39 
     40 function childrenHaveEmptyBoundingClientRects(element) {
     41    Array.from(element.children).forEach(child => {
     42        var childBox = child.getBoundingClientRect();
     43        assert_true(childBox.left == 0 && childBox.right == 0 && childBox.top == 0 && childBox.bottom == 0);
     44    })
     45 }
     46 
     47 function participateToParentLayout(child) {
     48    var style = window.getComputedStyle(child);
     49    return style.getPropertyValue("display") !== "none" &&
     50        style.getPropertyValue("position") !== "absolute" &&
     51        style.getPropertyValue("position") !== "fixed";
     52 }
     53 
     54 function childrenParticipatingToLayout(element) {
     55    var children = [];
     56    Array.from(element.children).forEach(child => {
     57        if (participateToParentLayout(child))
     58            children.push(child);
     59    })
     60    return children;
     61 }
     62 
     63 function compareLayout(element, reference, epsilon) {
     64    // Compare sizes of elements and children.
     65    var param = getWritingMode(element, reference);
     66 
     67    compareSize(element, reference, epsilon);
     68    var elementBox = element.getBoundingClientRect();
     69    var referenceBox = reference.getBoundingClientRect();
     70 
     71    var elementChildren = childrenParticipatingToLayout(element);
     72    var referenceChildren = childrenParticipatingToLayout(reference);
     73    if (elementChildren.length != referenceChildren.length)
     74        throw "Reference should have the same number of children participating to layout."
     75 
     76    for (var i = 0; i < elementChildren.length; i++) {
     77        compareSize(elementChildren[i], referenceChildren[i], epsilon);
     78 
     79        var childBox = elementChildren[i].getBoundingClientRect();
     80        var referenceChildBox = referenceChildren[i].getBoundingClientRect();
     81 
     82        switch(param.mode) {
     83        case "horizontal-tb":
     84            assert_approx_equals(param.rtl ?
     85                                 elementBox.right - childBox.right :
     86                                 childBox.left - elementBox.left,
     87                                 referenceChildBox.left - referenceBox.left,
     88                                 epsilon,
     89                                 `inline position (child ${i})`);
     90            assert_approx_equals(childBox.top - elementBox.top,
     91                                 referenceChildBox.top - referenceBox.top,
     92                                 epsilon,
     93                                 `block position (child ${i})`);
     94            break;
     95        case "vertical-lr":
     96        case "vertical-rl":
     97            assert_approx_equals(param.rtl ?
     98                                 elementBox.bottom - childBox.bottom :
     99                                 childBox.top - elementBox.top,
    100                                 referenceChildBox.left - referenceBox.left,
    101                                 epsilon,
    102                                 `inline position (child ${i})`);
    103            assert_approx_equals(elementBox.right - childBox.right,
    104                                 referenceChildBox.top - referenceBox.top,
    105                                 epsilon,
    106                                 `block position (child ${i})`);
    107            break;
    108        default:
    109            throw "compareLayout: Unrecognized writing-mode value";
    110        }
    111    }
    112 }