Refactor settings and extensions browser tests to use common isVisible

Several browser_test test suites implemented the same version of a
helper function to check if a particular element is visible. This CL
refactor these tests to use an already commonly available util function.

The original isVisible functionality is moved to isChildVisible and
isVisible is adjusted to directly check the element parameter. Call sites
that relied on the previous behavior have been refactored to use
isChildVisible.

Bug: 814436
Change-Id: I1d75f0562cd8ba789fab3e89bbd115ea7c85862b
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2030921Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Commit-Queue: Theodore Olsauskas-Warren <sauski@google.com>
Cr-Commit-Position: refs/heads/master@{#738653}

chrome/test/data/webui/cr_elements/BUILD.gn

@@ -52,6 +52,7 @@ js_modulizer("modulize") {
     "Polymer.dom.flush|flush",
     "test_util.eventToPromise|eventToPromise",
     "test_util.flushTasks|flushTasks",
+    "test_util.isChildVisible|isChildVisible",
     "test_util.isVisible|isVisible",
     "test_util.waitBeforeNextRender|waitBeforeNextRender",
     "test_util.whenAttributeIs|whenAttributeIs",

chrome/test/data/webui/cr_elements/cr_view_manager_test.js

@@ -5,7 +5,7 @@
 // clang-format off
 // #import 'chrome://resources/cr_elements/cr_view_manager/cr_view_manager.m.js';
 // #import {assert} from 'chrome://resources/js/assert.m.js';
-// #import {isVisible} from '../test_util.m.js';
+// #import {isChildVisible} from '../test_util.m.js';
 // clang-format on
 
 /** @fileoverview Suite of tests for cr-view-manager. */
@@ -42,7 +42,7 @@ cr.define('cr_view_manager_test', function() {
     test(assert(TestNames.Visibility), function() {
       function assertViewVisible(id, expectIsVisible) {
         const expectFunc = expectIsVisible ? expectTrue : expectFalse;
-        expectFunc(test_util.isVisible(viewManager, '#' + id, true));
+        expectFunc(test_util.isChildVisible(viewManager, '#' + id, true));
       }
 
       assertViewVisible('viewOne', false);

chrome/test/data/webui/extensions/code_section_test.js

@@ -6,7 +6,7 @@
 import 'chrome://extensions/extensions.js';
 
 import {assert} from 'chrome://resources/js/assert.m.js';
-import {isVisible} from '../test_util.m.js';
+import {isChildVisible} from '../test_util.m.js';
 
 window.extension_code_section_tests = {};
 extension_code_section_tests.suiteName = 'ExtensionCodeSectionTest';
@@ -39,7 +39,7 @@ suite(extension_code_section_tests.suiteName, function() {
       message: 'Highlight message',
     };
 
-    const testIsVisible = isVisible.bind(null, codeSection);
+    const testIsVisible = isChildVisible.bind(null, codeSection);
     expectFalse(!!codeSection.code);
     expectTrue(codeSection.$$('#scroll-container').hidden);
     expectFalse(testIsVisible('#main'));

chrome/test/data/webui/extensions/detail_view_test.js

@@ -8,7 +8,7 @@ import {navigation, Page} from 'chrome://extensions/extensions.js';
 import {assert} from 'chrome://resources/js/assert.m.js';
 import {flush} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
-import {isVisible} from '../test_util.m.js';
+import {isChildVisible} from '../test_util.m.js';
 
 import {createExtensionInfo, MockItemDelegate} from './test_util.js';
 
@@ -60,7 +60,7 @@ suite(extension_detail_view_tests.suiteName, function() {
   test(assert(extension_detail_view_tests.TestNames.Layout), function() {
     flush();
 
-    const testIsVisible = isVisible.bind(null, item);
+    const testIsVisible = isChildVisible.bind(null, item);
     expectTrue(testIsVisible('#closeButton'));
     expectTrue(testIsVisible('#icon'));
     expectTrue(testIsVisible('#enableToggle'));
@@ -79,15 +79,15 @@ suite(extension_detail_view_tests.suiteName, function() {
     ];
     const isChecked = id => item.$$(id).checked;
     for (let option of accessOptions) {
-      expectTrue(isVisible(item, option.id));
+      expectTrue(isChildVisible(item, option.id));
       expectFalse(isChecked(option.id), option.id);
       item.set('data.' + option.key + '.isEnabled', false);
       flush();
-      expectFalse(isVisible(item, option.id));
+      expectFalse(isChildVisible(item, option.id));
       item.set('data.' + option.key + '.isEnabled', true);
       item.set('data.' + option.key + '.isActive', true);
       flush();
-      expectTrue(isVisible(item, option.id));
+      expectTrue(isChildVisible(item, option.id));
       expectTrue(isChecked(option.id));
     }
 
@@ -260,19 +260,19 @@ suite(extension_detail_view_tests.suiteName, function() {
     item.set('data.location', 'FROM_STORE');
     flush();
     assertEquals('Chrome Web Store', item.$.source.textContent.trim());
-    assertFalse(isVisible(item, '#load-path'));
+    assertFalse(isChildVisible(item, '#load-path'));
 
     item.set('data.location', 'THIRD_PARTY');
     flush();
     assertEquals('Added by a third-party', item.$.source.textContent.trim());
-    assertFalse(isVisible(item, '#load-path'));
+    assertFalse(isChildVisible(item, '#load-path'));
 
     item.set('data.location', 'UNPACKED');
     item.set('data.prettifiedPath', 'foo/bar/baz/');
     flush();
     assertEquals('Unpacked extension', item.$.source.textContent.trim());
     // Test whether the load path is displayed for unpacked extensions.
-    assertTrue(isVisible(item, '#load-path'));
+    assertTrue(isChildVisible(item, '#load-path'));
 
     item.set('data.location', 'UNKNOWN');
     item.set('data.prettifiedPath', '');
@@ -280,7 +280,7 @@ suite(extension_detail_view_tests.suiteName, function() {
     item.set('data.locationText', 'Foo');
     flush();
     assertEquals('Foo', item.$.source.textContent.trim());
-    assertFalse(isVisible(item, '#load-path'));
+    assertFalse(isChildVisible(item, '#load-path'));
   });
 
   test(
@@ -354,7 +354,7 @@ suite(extension_detail_view_tests.suiteName, function() {
   test(assert(extension_detail_view_tests.TestNames.Warnings), function() {
     const testWarningVisible = function(id, expectVisible) {
       const f = expectVisible ? expectTrue : expectFalse;
-      f(isVisible(item, id));
+      f(isChildVisible(item, id));
     };
 
     testWarningVisible('#runtime-warnings', false);
@@ -378,7 +378,7 @@ suite(extension_detail_view_tests.suiteName, function() {
     testWarningVisible('#suspicious-warning', false);
     testWarningVisible('#blacklisted-warning', false);
     testWarningVisible('#update-required-warning', false);
-    const testIsVisible = isVisible.bind(null, item);
+    const testIsVisible = isChildVisible.bind(null, item);
     expectTrue(testIsVisible('#enableToggle'));
     expectFalse(testIsVisible('#enableButton'));
 

chrome/test/data/webui/extensions/error_page_test.js

@@ -9,7 +9,7 @@ import {assert} from 'chrome://resources/js/assert.m.js';
 import {PromiseResolver} from 'chrome://resources/js/promise_resolver.m.js';
 import {flush} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
-import {isVisible} from '../test_util.m.js';
+import {isChildVisible} from '../test_util.m.js';
 
 import {ClickMock, createExtensionInfo} from './test_util.js';
 
@@ -86,7 +86,7 @@ suite(extension_error_page_tests.suiteName, function() {
   test(assert(extension_error_page_tests.TestNames.Layout), function() {
     flush();
 
-    const testIsVisible = isVisible.bind(null, errorPage);
+    const testIsVisible = isChildVisible.bind(null, errorPage);
     expectTrue(testIsVisible('#closeButton'));
     expectTrue(testIsVisible('#heading'));
     expectTrue(testIsVisible('#errorsList'));

chrome/test/data/webui/extensions/item_test.js

@@ -9,7 +9,7 @@ import {assert} from 'chrome://resources/js/assert.m.js';
 import {tap} from 'chrome://resources/polymer/v3_0/iron-test-helpers/mock-interactions.js';
 import {flush} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
-import {isVisible} from '../test_util.m.js';
+import {isChildVisible} from '../test_util.m.js';
 
 import {TestService} from './test_service.js';
 import {createExtensionInfo, MockItemDelegate, testVisible} from './test_util.js';
@@ -260,12 +260,15 @@ suite(extension_item_tests.suiteName, function() {
     const kRuntime = 1 << 3;
 
     function assertWarnings(mask) {
-      assertEquals(!!(mask & kCorrupt), isVisible(item, '#corrupted-warning'));
       assertEquals(
-          !!(mask & kSuspicious), isVisible(item, '#suspicious-warning'));
+          !!(mask & kCorrupt), isChildVisible(item, '#corrupted-warning'));
       assertEquals(
-          !!(mask & kBlacklisted), isVisible(item, '#blacklisted-warning'));
-      assertEquals(!!(mask & kRuntime), isVisible(item, '#runtime-warnings'));
+          !!(mask & kSuspicious), isChildVisible(item, '#suspicious-warning'));
+      assertEquals(
+          !!(mask & kBlacklisted),
+          isChildVisible(item, '#blacklisted-warning'));
+      assertEquals(
+          !!(mask & kRuntime), isChildVisible(item, '#runtime-warnings'));
     }
 
     assertWarnings(0);
@@ -298,33 +301,33 @@ suite(extension_item_tests.suiteName, function() {
   });
 
   test(assert(extension_item_tests.TestNames.SourceIndicator), function() {
-    expectFalse(isVisible(item, '#source-indicator'));
+    expectFalse(isChildVisible(item, '#source-indicator'));
     item.set('data.location', 'UNPACKED');
     flush();
-    expectTrue(isVisible(item, '#source-indicator'));
+    expectTrue(isChildVisible(item, '#source-indicator'));
     const icon = item.$$('#source-indicator iron-icon');
     assertTrue(!!icon);
     expectEquals('extensions-icons:unpacked', icon.icon);
 
     item.set('data.location', 'THIRD_PARTY');
     flush();
-    expectTrue(isVisible(item, '#source-indicator'));
+    expectTrue(isChildVisible(item, '#source-indicator'));
     expectEquals('extensions-icons:input', icon.icon);
 
     item.set('data.location', 'UNKNOWN');
     flush();
-    expectTrue(isVisible(item, '#source-indicator'));
+    expectTrue(isChildVisible(item, '#source-indicator'));
     expectEquals('extensions-icons:input', icon.icon);
 
     item.set('data.location', 'FROM_STORE');
     item.set('data.controlledInfo', {type: 'POLICY', text: 'policy'});
     flush();
-    expectTrue(isVisible(item, '#source-indicator'));
+    expectTrue(isChildVisible(item, '#source-indicator'));
     expectEquals('extensions-icons:business', icon.icon);
 
     item.set('data.controlledInfo', null);
     flush();
-    expectFalse(isVisible(item, '#source-indicator'));
+    expectFalse(isChildVisible(item, '#source-indicator'));
   });
 
   test(

chrome/test/data/webui/extensions/keyboard_shortcuts_test.js

@@ -8,7 +8,7 @@ import {isValidKeyCode, Key, keystrokeToString} from 'chrome://extensions/extens
 import {assert} from 'chrome://resources/js/assert.m.js';
 import {flush} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
-import {isVisible} from '../test_util.m.js';
+import {isChildVisible} from '../test_util.m.js';
 
 import {TestService} from './test_service.js';
 import {createExtensionInfo} from './test_util.js';
@@ -83,7 +83,7 @@ suite(extension_shortcut_tests.suiteName, function() {
     const isVisibleOnCard = function(e, s) {
       // We check the light DOM in the card because it's a regular old div,
       // rather than a fancy-schmancy custom element.
-      return isVisible(e, s, true);
+      return isChildVisible(e, s, true);
     };
     const cards =
         keyboardShortcuts.$$('#container').querySelectorAll('.shortcut-card');

chrome/test/data/webui/extensions/runtime_host_permissions_test.js

@@ -6,7 +6,7 @@ import 'chrome://extensions/extensions.js';
 
 import {flush} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
-import {eventToPromise, isVisible} from '../test_util.m.js';
+import {eventToPromise, isChildVisible} from '../test_util.m.js';
 
 import {TestService} from './test_service.js';
 
@@ -41,7 +41,7 @@ suite('RuntimeHostPermissions', function() {
     element.set('permissions', permissions);
     flush();
 
-    const testIsVisible = isVisible.bind(null, element);
+    const testIsVisible = isChildVisible.bind(null, element);
     expectTrue(testIsVisible('#host-access'));
 
     const selectHostAccess = element.$$('#host-access');
@@ -216,7 +216,7 @@ suite('RuntimeHostPermissions', function() {
 
     const addHostButton = element.$$('#add-host');
     assertTrue(!!addHostButton);
-    expectTrue(isVisible(element, '#add-host'));
+    expectTrue(isChildVisible(element, '#add-host'));
 
     addHostButton.click();
     flush();

chrome/test/data/webui/extensions/shortcut_input_test.js

@@ -14,7 +14,7 @@ import {assert} from 'chrome://resources/js/assert.m.js';
 import {keyDownOn, keyUpOn, tap} from 'chrome://resources/polymer/v3_0/iron-test-helpers/mock-interactions.js';
 import {flush} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
-import {isVisible} from '../test_util.m.js';
+import {isChildVisible} from '../test_util.m.js';
 
 import {TestService} from './test_service.js';
 
@@ -42,7 +42,7 @@ suite(extension_shortcut_input_tests.suiteName, function() {
   test(assert(extension_shortcut_input_tests.TestNames.Basic), function() {
     const field = input.$['input'];
     assertEquals('', field.value);
-    const isClearVisible = isVisible.bind(null, input, '#clear', false);
+    const isClearVisible = isChildVisible.bind(null, input, '#clear', false);
     expectFalse(isClearVisible());
 
     // Click the input. Capture should start.

chrome/test/data/webui/extensions/test_util.js

@@ -4,7 +4,7 @@
 
 /** @fileoverview Common utilities for extension ui tests. */
 import {MockController, MockMethod} from '../mock_controller.m.js';
-import {isVisible} from '../test_util.m.js';
+import {isChildVisible} from '../test_util.m.js';
 
 import {TestKioskBrowserProxy} from './test_kiosk_browser_proxy.js';
 
@@ -151,7 +151,7 @@ export function isElementVisible(element) {
  */
 export function testVisible(
     parentEl, selector, expectedVisible, opt_expectedText) {
-  const visible = isVisible(parentEl, selector);
+  const visible = isChildVisible(parentEl, selector);
   expectEquals(expectedVisible, visible, selector);
   if (expectedVisible && visible && opt_expectedText) {
     const element = parentEl.$$(selector);

chrome/test/data/webui/new_tab_page/test_support.js

@@ -21,16 +21,6 @@ export function keydown(element, key) {
   keyDownOn(element, '', [], key);
 }
 
-/**
- * @param {!HTMLElement} element
- * @return {boolean}
- */
-export function isVisible(element) {
-  return !!(
-      element.offsetWidth || element.offsetHeight ||
-      element.getClientRects().length);
-}
-
 /**
  * Asserts the computed style value for an element.
  * @param {!HTMLElement} element The element.

chrome/test/data/webui/new_tab_page/voice_search_overlay_test.js

@@ -6,8 +6,8 @@ import 'chrome://new-tab-page/voice_search_overlay.js';
 
 import {BrowserProxy} from 'chrome://new-tab-page/browser_proxy.js';
 import {loadTimeData} from 'chrome://resources/js/load_time_data.m.js';
-import {flushTasks} from 'chrome://test/test_util.m.js';
-import {assertStyle, createTestProxy, isVisible} from './test_support.js';
+import {flushTasks, isVisible} from 'chrome://test/test_util.m.js';
+import {assertStyle, createTestProxy} from './test_support.js';
 
 class MockSpeechRecognition {
   constructor() {

chrome/test/data/webui/settings/cr_settings_browsertest.js

@@ -484,6 +484,7 @@ CrSettingsPeoplePageSyncAccountControlTest.prototype = {
   /** @override */
   extraLibraries: CrSettingsBrowserTest.prototype.extraLibraries.concat([
     '../test_browser_proxy.js',
+    '../test_util.js',
     'sync_test_util.js',
     'test_sync_browser_proxy.js',
     'sync_account_control_test.js',

chrome/test/data/webui/settings/personalization_options_test.js

@@ -3,14 +3,6 @@
 // found in the LICENSE file.
 
 cr.define('settings_personalization_options', function() {
-  /**
-   * @param {!Element} element
-   * @param {boolean} displayed
-   */
-  function assertVisible(element, displayed) {
-    assertEquals(
-        displayed, window.getComputedStyle(element)['display'] != 'none');
-  }
 
   suite('PersonalizationOptionsTests_AllBuilds', function() {
     /** @type {settings.TestPrivacyPageBrowserProxy} */
@@ -83,7 +75,7 @@ cr.define('settings_personalization_options', function() {
     if (!cr.isChromeOS) {
       test('signinAllowedToggle', function() {
         const toggle = testElement.$.signinAllowedToggle;
-        assertVisible(toggle, true);
+        assertTrue(test_util.isVisible(toggle));
 
         testElement.syncStatus = {signedIn: false};
         // Check initial setup.
@@ -257,7 +249,7 @@ cr.define('settings_personalization_options', function() {
     test('LinkDoctor', function() {
       // The Link Doctor setting exists if the |privacySettingsRedesignEnabled|
       // has not been turned on.
-      assertVisible(testElement.$$('#linkDoctor'), true);
+      assertTrue(test_util.isChildVisible(testElement, '#linkDoctor'));
     });
   });
 });

chrome/test/data/webui/settings/privacy_page_test.js

@@ -3,14 +3,6 @@
 // found in the LICENSE file.
 
 cr.define('settings_privacy_page', function() {
-  /**
-   * @param {!Element} element
-   * @param {boolean} displayed
-   */
-  function assertVisible(element, displayed) {
-    assertEquals(
-        displayed, window.getComputedStyle(element)['display'] != 'none');
-  }
 
   /** @implements {settings.ClearBrowsingDataBrowserProxy} */
   class TestClearBrowsingDataBrowserProxy extends TestBrowserProxy {
@@ -396,10 +388,12 @@ cr.define('settings_privacy_page', function() {
         });
         Polymer.dom.flush();
         assertTrue(!!element.$$('#clearBrowsingDataDialog [slot=footer]'));
-        assertVisible(element.$$('#sync-info'), true);
-        assertVisible(element.$$('#sync-paused-info'), false);
-        assertVisible(element.$$('#sync-passphrase-error-info'), false);
-        assertVisible(element.$$('#sync-other-error-info'), false);
+        assertTrue(test_util.isChildVisible(element, '#sync-info'));
+        assertFalse(test_util.isChildVisible(element, '#sync-paused-info'));
+        assertFalse(
+            test_util.isChildVisible(element, '#sync-passphrase-error-info'));
+        assertFalse(
+            test_util.isChildVisible(element, '#sync-other-error-info'));
 
         // Sync is paused.
         cr.webUIListenerCallback('sync-status-changed', {
@@ -408,10 +402,12 @@ cr.define('settings_privacy_page', function() {
           statusAction: settings.StatusAction.REAUTHENTICATE,
         });
         Polymer.dom.flush();
-        assertVisible(element.$$('#sync-info'), false);
-        assertVisible(element.$$('#sync-paused-info'), true);
-        assertVisible(element.$$('#sync-passphrase-error-info'), false);
-        assertVisible(element.$$('#sync-other-error-info'), false);
+        assertFalse(test_util.isChildVisible(element, '#sync-info'));
+        assertTrue(test_util.isChildVisible(element, '#sync-paused-info'));
+        assertFalse(
+            test_util.isChildVisible(element, '#sync-passphrase-error-info'));
+        assertFalse(
+            test_util.isChildVisible(element, '#sync-other-error-info'));
 
         // Sync passphrase error.
         cr.webUIListenerCallback('sync-status-changed', {
@@ -420,10 +416,12 @@ cr.define('settings_privacy_page', function() {
           statusAction: settings.StatusAction.ENTER_PASSPHRASE,
         });
         Polymer.dom.flush();
-        assertVisible(element.$$('#sync-info'), false);
-        assertVisible(element.$$('#sync-paused-info'), false);
-        assertVisible(element.$$('#sync-passphrase-error-info'), true);
-        assertVisible(element.$$('#sync-other-error-info'), false);
+        assertFalse(test_util.isChildVisible(element, '#sync-info'));
+        assertFalse(test_util.isChildVisible(element, '#sync-paused-info'));
+        assertTrue(
+            test_util.isChildVisible(element, '#sync-passphrase-error-info'));
+        assertFalse(
+            test_util.isChildVisible(element, '#sync-other-error-info'));
 
         // Other sync error.
         cr.webUIListenerCallback('sync-status-changed', {
@@ -432,10 +430,11 @@ cr.define('settings_privacy_page', function() {
           statusAction: settings.StatusAction.NO_ACTION,
         });
         Polymer.dom.flush();
-        assertVisible(element.$$('#sync-info'), false);
-        assertVisible(element.$$('#sync-paused-info'), false);
-        assertVisible(element.$$('#sync-passphrase-error-info'), false);
-        assertVisible(element.$$('#sync-other-error-info'), true);
+        assertFalse(test_util.isChildVisible(element, '#sync-info'));
+        assertFalse(test_util.isChildVisible(element, '#sync-paused-info'));
+        assertFalse(
+            test_util.isChildVisible(element, '#sync-passphrase-error-info'));
+        assertTrue(test_util.isChildVisible(element, '#sync-other-error-info'));
       });
 
       test('ClearBrowsingDataPauseSyncDesktop', function() {
@@ -446,7 +445,7 @@ cr.define('settings_privacy_page', function() {
         Polymer.dom.flush();
         assertTrue(!!element.$$('#clearBrowsingDataDialog [slot=footer]'));
         const syncInfo = element.$$('#sync-info');
-        assertVisible(syncInfo, true);
+        assertTrue(test_util.isVisible(syncInfo));
         const signoutLink = syncInfo.querySelector('a[href]');
         assertTrue(!!signoutLink);
         assertEquals(0, testSyncBrowserProxy.getCallCount('pauseSync'));
@@ -463,7 +462,7 @@ cr.define('settings_privacy_page', function() {
         Polymer.dom.flush();
         assertTrue(!!element.$$('#clearBrowsingDataDialog [slot=footer]'));
         const syncInfo = element.$$('#sync-paused-info');
-        assertVisible(syncInfo, true);
+        assertTrue(test_util.isVisible(syncInfo));
         const signinLink = syncInfo.querySelector('a[href]');
         assertTrue(!!signinLink);
         assertEquals(0, testSyncBrowserProxy.getCallCount('startSignIn'));
@@ -480,7 +479,7 @@ cr.define('settings_privacy_page', function() {
         Polymer.dom.flush();
         assertTrue(!!element.$$('#clearBrowsingDataDialog [slot=footer]'));
         const syncInfo = element.$$('#sync-passphrase-error-info');
-        assertVisible(syncInfo, true);
+        assertTrue(test_util.isVisible(syncInfo));
         const passphraseLink = syncInfo.querySelector('a[href]');
         assertTrue(!!passphraseLink);
         passphraseLink.click();

chrome/test/data/webui/test_util.js

@@ -111,20 +111,27 @@ cr.define('test_util', function() {
   }
 
   /**
-   * Returns whether or not the element specified is visible. This is different
-   * from isElementVisible in that this function attempts to search for the
-   * element within a parent element, which means you can use it to check if
-   * the element exists at all.
+   * Returns whether or not the element specified is visible.
+   * @param {!HTMLElement} element
+   * @return {boolean}
+   */
+  /* #export */ function isVisible(element) {
+    const rect = element ? element.getBoundingClientRect() : null;
+    return (!!rect && rect.width * rect.height > 0);
+  }
+
+  /**
+   * Searches the DOM of the parentEl element for a child matching the provided
+   * selector then checks the visibility of the child.
    * @param {!HTMLElement} parentEl
    * @param {string} selector
    * @param {boolean=} checkLightDom
    * @return {boolean}
    */
-  /* #export */ function isVisible(parentEl, selector, checkLightDom) {
+  /* #export */ function isChildVisible(parentEl, selector, checkLightDom) {
     const element = (checkLightDom ? parentEl.querySelector : parentEl.$$)
                         .call(parentEl, selector);
-    const rect = element ? element.getBoundingClientRect() : null;
-    return !!rect && rect.width * rect.height > 0;
+    return isVisible(element);
   }
 
   // #cr_define_end
@@ -133,6 +140,7 @@ cr.define('test_util', function() {
     fakeDataBind: fakeDataBind,
     flushTasks: flushTasks,
     isVisible: isVisible,
+    isChildVisible: isChildVisible,
     waitAfterNextRender: waitAfterNextRender,
     waitBeforeNextRender: waitBeforeNextRender,
     whenAttributeIs: whenAttributeIs,