summaryrefslogtreecommitdiffstats
path: root/devtools/client/responsivedesign/test/browser_responsive_devicewidth.js
blob: 604a207837d6b4c98f3fbc3321d83539d0eab8ac (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */

"use strict";

add_task(function* () {
  let tab = yield addTab("about:logo");
  let { rdm, manager } = yield openRDM(tab);
  ok(rdm, "An instance of the RDM should be attached to the tab.");
  yield setSize(rdm, manager, 110, 500);

  info("Checking initial width/height properties.");
  yield doInitialChecks();

  info("Changing the RDM size");
  yield setSize(rdm, manager, 90, 500);

  info("Checking for screen props");
  yield checkScreenProps();

  info("Setting docShell.deviceSizeIsPageSize to false");
  yield ContentTask.spawn(gBrowser.selectedBrowser, {}, function* () {
    let docShell = content.QueryInterface(Ci.nsIInterfaceRequestor)
                          .getInterface(Ci.nsIWebNavigation)
                          .QueryInterface(Ci.nsIDocShell);
    docShell.deviceSizeIsPageSize = false;
  });

  info("Checking for screen props once again.");
  yield checkScreenProps2();

  yield closeRDM(rdm);
});

function* doInitialChecks() {
  let {innerWidth, matchesMedia} = yield grabContentInfo();
  is(innerWidth, 110, "initial width should be 110px");
  ok(!matchesMedia, "media query shouldn't match.");
}

function* checkScreenProps() {
  let {matchesMedia, screen} = yield grabContentInfo();
  ok(matchesMedia, "media query should match");
  isnot(window.screen.width, screen.width,
        "screen.width should not be the size of the screen.");
  is(screen.width, 90, "screen.width should be the page width");
  is(screen.height, 500, "screen.height should be the page height");
}

function* checkScreenProps2() {
  let {matchesMedia, screen} = yield grabContentInfo();
  ok(!matchesMedia, "media query should be re-evaluated.");
  is(window.screen.width, screen.width,
     "screen.width should be the size of the screen.");
}

function grabContentInfo() {
  return ContentTask.spawn(gBrowser.selectedBrowser, {}, function* () {
    return {
      screen: {
        width: content.screen.width,
        height: content.screen.height
      },
      innerWidth: content.innerWidth,
      matchesMedia: content.matchMedia("(max-device-width:100px)").matches
    };
  });
}