Fathom/In-Page Pop-Up Detection

From MozillaWiki
Jump to: navigation, search

In-Page Pop-up Detection

This is an experiment to try to train an in-page pop-up detector using Fathom.

Corpus

The first step for this project is curating a dataset of these in-page pop-ups. In order to do so we're crowd-sourcing an effort through the community to collect the addresses of a large number of pages that show such pop-ups using a Google Form, a Firefox Extension and a Chrome Extension.

Extra data sources

 * http://tabcloseddidntread.com/
 * http://confirmshaming.tumblr.com/
 * https://github.com/yourduskquibbles/webannoyances

Freezing and labeling the corpus

Tips
  • Turn Responsive Design mode on, and set it to 1024x768.
  • Capture in a clean Firefox profile with no other addons. Some ad blockers will make changes to the DOM, like adding style attributes to ad iframes to hide them.
Labels
overlay
The usually-translucent thing some pages throw over their content to obscure it while the modal is active. Label the outermost component of this.
popUp
The outermost container that is part of the popup, i.e. nothing of value should be lost by deleting it. Often, the overlay and the popup are the same element, or the overlay contains the popup. If there are multiple outermost containers forming the popup, label them all.
closeButton
The element you click to dismiss the popup. If you find it hard to decide, choose the element having the event handler.

Notes for writing the features

 * https://alisdair.mcdiarmid.org/kill-sticky-headers/
 * (bookmarklet) javascript:void([].forEach.call(document.querySelectorAll('body *'),e=>/fixed|sticky/.test(getComputedStyle(e).position)&&e.parentNode.removeChild(e)))
 * (bookmarklet) javascript:(function()%7B(function () %7Bvar i%2C elements %3D document.querySelectorAll('body *')%3Bfor (i %3D 0%3B i < elements.length%3B i%2B%2B) %7Bif (getComputedStyle(elements%5Bi%5D).position %3D%3D%3D 'fixed') %7Belements%5Bi%5D.parentNode.removeChild(elements%5Bi%5D)%3B%7D%7D%7D)()%7D)()
 * Behind the overlay and Behind the overlay revival extensions.  The former has code for overlay removal which might be helpful for writing the initial feature rules.
 * chrome-overlay-blocker is an extension for detecting pop-up overlays automatically using CSS animations.