notes on testing Firefox themes

Discuss application theming and theme development.
Locked
User avatar
mcdavis
Posts: 3195
Joined: December 9th, 2005, 5:51 am

notes on testing Firefox themes

Post by mcdavis »

Here are a few notes I have on testing themes for Firefox. It could use help, so if you see anything missing, feel free to speak up.

One glaring omission is how to test UI for blacklisted plug-ins and add-ons.

patrickjdempsey wrote:... automated screenshot testing ...


I need that too. It seems like it's in striking distance: MozMill + Canvas + (if necessary) control by a remote process


--------------------------

about:neterror
about:certerror
about:sessionrestore
about:license
about:rights
about:buildconfig
about:support
about:memory
about:plugins
about:robots
about:privatebrowsing (before private browsing engaged)
about:privatebrowsing (landing page, after starting private browsing)
about:
about:mozilla
about:config
about:crashes
about:cache
about:cache?device=disk
about:cache?device=memory
about:credits
about:logo
about:sync-log (with Weave)
about:addons (Fx3.7/4.0+)
About Firefox (Normal View)
About Firefox (Credits View)

certerror user-defined exception (TODO how test?)

gopher page (to test: gopher://gopher.floodgap.com/ )
ftp page (to test: ftp://archive.mozilla.org/pub/mozilla.o ... /releases/ )
local directory page (to test: file://c:/ )
jar contents
- to test:
- denied for security because remote: jar:https://bugzilla.mozilla.org/attachment.cgi?id=288634!/
- permitted because local file: jar:file:///D:/MCD/dvl/moztheme/nasanightlaunch/packed/nightlaunch_NNN.jar!/
- note the jar: on the front and the bang-slash on the end -- the rest is any valid URL (that happens to refer to a JAR)

xml preview (unformatted display of xml document) (test with chrome://global/content/bindings/textbox.xml)

view page source (right-click in page, click View Page Source)

print preview
page setup

KUI tab preview
- to test: must set pref browser.ctrlTab.previews=true , then press ctrl-TAB

Location bar
- in popup windows, URL bar is displayed as readonly (and is always displayed, whether the popup wants it or not)
-- to test: in fx3.5, visit https://.bugzilla.mozilla.org/attachment.cgi?id=370495# , then click the link. for some reason, this isn't working in 3.6, maybe because of some add-on i have. does not matter whether popups are blocked or not -- but does require javascript to be enabled
-- to test: go to any MDC page, select "print this page"
- styling of identity box BUTTON to represent security state
-- none
-- SSL without EV (blue is standard)
-- SSL with EV (green is standard)
- styling of identity box POPUP to represent security state
-- none
-- SSL without EV (blue is standard)
-- SSL with EV (green is standard)

phishing warning page (to test: https://www.mozilla.com/firefox/its-a-trap.html )
- notification strip after ignoring phishing warning
malware warning page (to test: https://www.mozilla.com/firefox/its-an-attack.html )
- notification strip after ignoring malware warning
search bar blue glow, indicating page with an available search engine (to test: http://www.urbandictionary.com , making sure its search plugin is already uninstalled first)
glow when opening a tab not visible in the tabstrip
"Page Report First Time" -- first time a pop-up is blocked -- chrome://browser/content/pageReportFirstTime.xul

missing plugins
- test with http://mxr.mozilla.org/mozilla-central/ ... anity.html
- test with http://www.javatester.org/version.html (disable java to see Fx's in-page disabled plugin icon)
- notification strip for missing plugin
-- uses pluginMissing-16.png
- plugin finder window

disabled plugins
- should see this in two places:
-- in add-ons manager plugins list, disabled plugins icon should be darker gray
-- in content pages as a placeholder for the disabled plugin
- to test:
-- go to add-ons manager, disable the flash plugin
-- visit any page with flash video, such as http://www.boingboing.net/2010/05/13/er ... a-gia.html
-- the disabled plugin icon should appear in place of the plugin content

crashed plugins (beginning with Fx3.6.4)
- WARNING - will trigger the crash with Flash versions before 10.1 : http://flashcrash.dempsky.org/
- if Flash version >= 10.1: trigger crashed plug-in UI by killing process plugin-conainer.exe
- notification strip if no room to display the crashed plugin UI in-page
- see also http://support.mozilla.com/en-US/kb/Plu ... oduct&as=u

Navigator toolbars
- toolbars - normal view
- toolbars - customizing view
- toolbars - with user-defined custom toolbars
- with various toolbars hidden
- F11 fullscreen
-- with and without autohide
-- minimize, restore, and close buttons while in fullscreen
- with url bar hidden (by hiding navbar or by removing urlbar through customize)
-- open location (file > open location, or ctrl-L)

Toolbar buttons
- plain old toolkit toolbarbuttons
- primary toolbarbutton (.toolbarbutton-1)
-- regular (to test: home button, Console 2 tbb)
-- type="menu" (to test: Stylish tbb is only one I found)
-- type="menu-button" (to test: almost any add-on tbb with dropmarker, but MR Tech Toolkit Extensions button))

Unified-back-forward-button (keyhole)
- various toolbar modes and icon sizes
- right-click to open popup tab-specific history list
- click dropmarker to open popup tab-specific history list
- arrow on menuitems should indicate "back" or "forward" motion
- dot on menuitem should indicate current

mouse-wheel middle-click to scroll in page: show 4-arrow icon

drag and drop onto tabstrip
drag and drop onto bookmarks toolbar
drag and drop onto bookmarks toolbar container
drag and drop onto bookmarks toolbar open container menu
drag and drop onto bookmarks menu in menubar

awesomebar
- awesomebar "searching" throbber
- results based on tag match
- results based on bookmark match
- results based on history match
- results based on title match
- results based on keyword match
- Fx3.7: matches existing other tab

first-run about:rights notification strip

geolocation notification strip (3.5.* and 3.6.*)
- to demo and test: http://www.mozilla.com/en-US/firefox/ge ... /#geo-demo
-- at the given URL, click 'Give It a Try', then 'Where Am I'.
-- there's a notification strip that pops up, showing Geo.png as the icon, asking to give permission or not
- pref: geo.enabled

geolocation doorhanger popup (3.7/4.0)
- to demo and test: http://www.mozilla.com/en-US/firefox/ge ... /#geo-demo
-- at the given URL, click 'Give It a Try', then 'Where Am I'.
-- there's a "doorhanger" style popup, coming down from the urlbar, asking to give permission or not
- if you say "never" you don't get asked again
-- you can reset that by going to menubar > tools > page info > permissions > share location

save password notification strip

first-run flash in find bar
not-found textbox color and icon in find bar

HTML5 video playback - normal view - http://www.double.co.nz/video_test/test5.html
HTML5 video playback - error during playback
HTML5 video playback - fullscreen view

Feed preview page
- for first-run case (browser.feeds.showFirstRunUI)
- for other-than-first-run case
Feed icon in URL bar
- for page with no feed https://bugzilla.mozilla.org/
- for page with only one feed http://www.nytimes.com/
- for page with multiple feeds https://developer.mozilla.org/en
Feeds menu popup (for a page offering multiple feeds)

Set desktop background dialog (to test: right-click on image in content area)

Download shown in statusbar
- in progress
- paused

TODO tab close button position modes

all the base widget types
- periodic table: http://www.hevanet.com/acorbin/xul/top.xul
- datepicker, timepicker
- textbox[type="search"]
- scale / slider
- notification type informatiom
- notification type warning
- notification type error
- resizer on arbitrary element (thus far requires 3.7)(to test: https://.bugzilla.mozilla.org/attachment.cgi?id=401470)

Downloads Manager
- download-in-progress indicator in status bar
- download complete popup desktop notification
- for item, buttons appropr for state: pause, resume, cancel, restart
- item blocked by parental controls

Search Engine Manager
- click search engine icon, pick "manage"

Add-ons Manager
- TODO blocklisting
- "need restart" notification strip
- compatibility checking off notification strip
- Software Installation dialog
- new add-on installed notification strip
- new add-on installed visual indicator on add-on entry (yellow "notification" bg in default theme)
- the Languages tab doesn't show up until you've installed a language, such as https://addons.mozilla.org/en-US/firefox/addon/4851
- offline mode notification when trying to search add-ons, with "Go Online" button
- when in online mode but the net connection is down, error message in middle of search results list: "Firefox could not retrieve add-ons"
- with a persona in the list of themes

Software Installation / xpinstallConfirm Dialog
- installing signed vs. installing unsigned
- to test signed: try Google toolbar https://addons.mozilla.org/en-US/firefox/addon/6249
- installing one vs. installing multiple (drag and drop multiple selected XPI's, all at once, from hard drive onto add-ons manager window)
- note CSS also used by add-ons e.g. Greasemonkey script installer

Options / Preferences / prefwindow
- firefox main prefwindow
- prefwindow[type="child"]
- prefwindow with only one pane (paneSelector collapses) (to test: see FireFTP v1.0.7 Options, chrome://fireftp/content/preferences.xul)
- an add-on with a prefwindow (e.g. MR Tech)
- multiplatform: win, mac, linux
- with browser.preferences.animateFadeIn true, with false
- with various font sizes
- view each and every prefpane

Page Info Window
- TODO view each and every pane
-- make sure the particular page triggers all five available panes

File Picker:
- Linux only: Menubar > Open File with pref ui.allow_platform_file_picker=true
- http://kb.mozillazine.org/Ui.allow_platform_file_picker
- chrome://global/content/filepicker.xul

Doorhanger-style popup notifications (for fx4 and up)
- used in the following locations
1 - identity popup (from site icon in urlbar)
2 - in-content invalid form popup
-- data:text/html,<!DOCTYPE html><html><head><style> label { font-weight: bold; }</style></head><body><form><label>Name <input value="Jonh Smith"></label><br><br><label>SSN <input pattern="\d\d\d-\d\d-\d\d\d\d" value="Don't know" title="Social Security Number must be in the format: NNN-NN-NNNN"></label><br><br><label>Message<br><textarea></textarea></label><br><br><input type='submit' value='Next'></form></body></html>
3 - geolocation permission popup
-- http://www.mozilla.com/en-US/firefox/ge ... /#geo-demo
4 - add-ons manager installation popup
-- TODO Q: how trigger the four kinds of notifications?
.popup-notification-icon[popupid="xpinstall-disabled"],
.popup-notification-icon[popupid="addon-install-blocked"],
.popup-notification-icon[popupid="addon-install-failed"],
.popup-notification-icon[popupid="addon-install-complete"]
-- install a big add-on (Shine Bright) from AMO
-- cancel it before done
-- click the notif icon in AOM
-- restart the installation
-- let it finish
-- with multiple messages in the same popup
--- e.g. one successful + one failed add-on install
--- to test
---- install two versions of the same add-on by drag and drop from hard drive to the add-ons manager at the same time
or
---- rename some JPG to .xpi to create an invalid XPI .e.g somefile.jpg --> somefile.xpi
---- switch to the add-ons manager
---- try to install somefile.xpi by drag and drop onto add-ons manager (it won't work)
---- successfully install some other xpi
---- make sure you're still on the add-ons manager
---- notice in the urlbar the icon indicating notification from add-ons manager
---- click it to open the notification popup
---- should see both notifications in the same popup
5 - password saving and changing popup
-- e.g. change your AMO password
6 - indexedDB permission popup
-- http://html5-demos.appspot.com/static/h ... index.html (requires JS enabled)
-- https://developer.mozilla.org/en-US/dem ... indexeddb/
7 - also can be used by any add-on that feels like it

For Fx6 and up, two popup instances (save password popup and edit bookmark panel) show a Sync promo at the bottom. To see this, reset pref browser.syncPromoViewsLeft to its default value.

- Doorhanger Testing note: for Fx4 through Fx8 nightlies, the "side" attribute is not always correctly set for "bottom" cases, such as when the urlbar is in the Add-on Bar and the site identity popup opens upward from it. In these cases, the attribute may exist but have no value. The arrowhead doesn't show in this case and our shadow is cropped wrong. This is true with both the default theme and NNL.

- Doorhanger Testing note: be sure to test on Linux, where box-shadow / partial transparency in arrowpanel isn't supported by Gecko on that platform, and should not be used. See viewtopic.php?p=10544231#p10544231 for details.

- Doorhanger Bonus: to temporarily show arrowpanel popups so they stay visible while you style them:
#identity-popup {
display: -moz-box !important;
-moz-margin-start: 20px !important;
}
-- use that in Stylish
-- open the panel once, first, the normal way, else you don't see the arrowhead
-- also works with #notification-popup and #invalid-form-popup
-- works for #editBookmarkPanel, but you'll need to click the bookmark star to make the panel contents show

- GCLI in Web Console (Fx12-ish)
-- see http://home.comcast.net/~username54321/ ... s.gcli.png
-- set devtools.gcli.enable to true in about:config, and then open the Web Console (no need to restart)
--- was enabled for a time in January 2012 Fx12nightlies, but currently disabled
--- not yet sure when pref will be enabled in released Firefox
-- 'help' output in Web Console
--- just type 'help'
-- 'help [command]' output in Web Console
--- just type 'help inspect'
-- hint menu popup - opens when clicking into command-line
--- hidden pref devtools.gcli.permaHint=true will make the hint popup stay open
-- hint menu popup argument completion
--- for help (arguments allowed but optional)
--- for console (argument required, pick from predefined list)
--- for echo (argument required, enter arbitrary text)
--- for inspect (argument required, enter CSS selector to match existing element)
--- for javascript (argument required, shows list of possible objects/functions for use in expression
---- list looks like a clickable menu but isn't clickable
--- error message in hint popup when entering an invalid argument
--- error message in hint popup when entering an unknown command
-- SHIFT+RETURN Scratchpad prompt at right end of command line
--- only shows when entering a JavaScript command (type '{')
-- command-line autocompletion
--- user input dark, completion suggestion dimmer
--- incomplete user input (could be completed but isn't yet a whole command) underlined in gray
--- erroneous user input (no matching completion) underlined in red
--- predictive completion
---- GCLI considers there to be two kinds of completion, strict and predictive.
---- Strict completion is shown with dim text adjoineding user-entered text.
---- Predictive completion is shown with predicted text following user-entered text and separated from it with Unicode character ‘\u21E5’, 'Rightward Arrow To Bar'.
---- To trigger predictive completion, enter the first part of a command (e.g., 'insp'), then left arrow backwards into what you just typed. GCLI considers this the trigger to switch from strict to predictive matching.
Last edited by mcdavis on September 22nd, 2015, 11:10 pm, edited 10 times in total.
Theme Development is Radical Participation.
NNL Beta Builds for Current and Up-coming Firefox
Dear User: Your Help is Needed
User avatar
patrickjdempsey
Posts: 23686
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC
Contact:

Re: notes on testing themes

Post by patrickjdempsey »

Oh boy, what a list! I'll take a closer look at it at some point and give you some feedback.
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/
User avatar
mcdavis
Posts: 3195
Joined: December 9th, 2005, 5:51 am

Re: notes on testing themes

Post by mcdavis »

That would be great. I was hoping we could flesh it out.
Theme Development is Radical Participation.
NNL Beta Builds for Current and Up-coming Firefox
Dear User: Your Help is Needed
User avatar
ehume
Posts: 6743
Joined: November 17th, 2002, 12:33 pm
Location: Princeton, NJ, USA

Re: notes on testing themes

Post by ehume »

I liked the first item on your list: about net terror
Firefox: Sic transit gloria mundi.
User avatar
mcdavis
Posts: 3195
Joined: December 9th, 2005, 5:51 am

Re: notes on testing themes

Post by mcdavis »

ehume wrote:about net terror


Good one. :) And, relevant to the experience of developing a theme .. especially for this release cycle.
Last edited by mcdavis on April 4th, 2011, 7:39 pm, edited 1 time in total.
Theme Development is Radical Participation.
NNL Beta Builds for Current and Up-coming Firefox
Dear User: Your Help is Needed
User avatar
Red_Fat_Lazy_Cat
Posts: 564
Joined: April 16th, 2003, 12:45 pm
Location: The ottoman near the fireplace
Contact:

Re: notes on testing themes

Post by Red_Fat_Lazy_Cat »



Hmm... But now that remote XUL is gone for good in Firefox 4, the XUL periodic table is no longer of any use... :(
Some people say that cats are sneaky, evil, and cruel. True, and they have many other fine qualities as well. -- Missy Dizick

My Firefox themes: Red Cats (blue & green flavor), Curacao
User avatar
mcdavis
Posts: 3195
Joined: December 9th, 2005, 5:51 am

Re: notes on testing themes

Post by mcdavis »

Yeah, I saw that too, that's too bad. It's not going to make testing any easier ...

I guess the thing to do is pack it up into an extension, then install that extension, then edit its installed chrome.manifest to point to live files on your hard drive, just like we do for our own add-ons. I haven't tried it but I think that would work.

(A close reading of Bugzilla shows there are ways around it, but it also seems like the devs are trying hard not to say out loud what that is, so I won't either. The first rule of XUL Blocking is Don't. Talk About. XUL Blocking.)
Theme Development is Radical Participation.
NNL Beta Builds for Current and Up-coming Firefox
Dear User: Your Help is Needed
User avatar
patrickjdempsey
Posts: 23686
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC
Contact:

Re: notes on testing themes

Post by patrickjdempsey »

That's fair enough... it would be nice if it was turned into a development tool or even MDC article.
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/
User avatar
ShareBird
Posts: 2740
Joined: December 8th, 2004, 7:09 am
Location: Berlin | Made in Brasil
Contact:

Re: notes on testing themes

Post by ShareBird »

Even worst: local XUL files aren't working too... I've written a couple XUL files to help development and they are also useless now.
Silvermel - A Theme for Firefox and Thunderbird
YATT - Yet Another Theme Tutorial
Don't give a man a fish. Teach him how to fish instead.
User avatar
mcdavis
Posts: 3195
Joined: December 9th, 2005, 5:51 am

Re: notes on testing themes

Post by mcdavis »

ShareBird wrote:I've written a couple XUL files to help development


Hmmm ... that sounds interesting. Anything you might want to trade? (I have test files for datepicker, timepicker, scale, and a couple others.)
Theme Development is Radical Participation.
NNL Beta Builds for Current and Up-coming Firefox
Dear User: Your Help is Needed
User avatar
ShareBird
Posts: 2740
Joined: December 8th, 2004, 7:09 am
Location: Berlin | Made in Brasil
Contact:

Re: notes on testing themes

Post by ShareBird »

mcdavis wrote:
ShareBird wrote:I've written a couple XUL files to help development


Hmmm ... that sounds interesting. Anything you might want to trade? (I have test files for datepicker, timepicker, scale, and a couple others.)

:-)
I've posted two of them here at the forum a while ago:
http://www.silvermel.de/dev/allTabs.xul
http://www.silvermel.de/dev/ctrlTab.xul

I have to look if I find some other files. I had a big problem with this old machine (PIII 1,1GHz) for a couple weeks and needed to format it...
Silvermel - A Theme for Firefox and Thunderbird
YATT - Yet Another Theme Tutorial
Don't give a man a fish. Teach him how to fish instead.
User avatar
mcdavis
Posts: 3195
Joined: December 9th, 2005, 5:51 am

Re: notes on testing themes

Post by mcdavis »

Thanks, here's mine. Nothing special, but they do help me.

http://home.comcast.net/~username54321/ ... picker.xul
http://home.comcast.net/~username54321/ ... picker.xul
http://home.comcast.net/~username54321/ ... /scale.xul

ShareBird wrote:I had a big problem with this old machine (PIII 1,1GHz) for a couple weeks and needed to format it...


Oooo .. not fun.
Theme Development is Radical Participation.
NNL Beta Builds for Current and Up-coming Firefox
Dear User: Your Help is Needed
User avatar
Red_Fat_Lazy_Cat
Posts: 564
Joined: April 16th, 2003, 12:45 pm
Location: The ottoman near the fireplace
Contact:

Re: notes on testing themes

Post by Red_Fat_Lazy_Cat »

ShareBird wrote:Even worst: local XUL files aren't working too... I've written a couple XUL files to help development and they are also useless now.


Cheer up, Sharebird - they are not useless. Do as the devs suggested and edit the permissions.sqlite database. Use SQLite Manager and insert the following values into the moz_hosts table:

Code: Select all

[leave the first field empty] 
 <file>
 allowXULXBL
 1
 0
 0


Restart Firefox - and bingo! Local XULs are at your beck and call. :)
Some people say that cats are sneaky, evil, and cruel. True, and they have many other fine qualities as well. -- Missy Dizick

My Firefox themes: Red Cats (blue & green flavor), Curacao
User avatar
mcdavis
Posts: 3195
Joined: December 9th, 2005, 5:51 am

Re: notes on testing themes

Post by mcdavis »

The SQLite Manager method Red_Fat_Lazy_Cat talked about has been working great.

Jorge has also put up an extension for doing the same thing with some task-specific UI.

https://addons.mozilla.org/en-US/firefox/addon/235281/

(For anybody coming along and reading this months down the road: use with care. Remote XUL is a security risk, and it was disabled on purpose. I don't plan on enabling anything other than local XUL for testing purposes.)
Theme Development is Radical Participation.
NNL Beta Builds for Current and Up-coming Firefox
Dear User: Your Help is Needed
User avatar
ShareBird
Posts: 2740
Joined: December 8th, 2004, 7:09 am
Location: Berlin | Made in Brasil
Contact:

Re: notes on testing themes

Post by ShareBird »

Thank you Red_Fat_Lazy_Cat and mcdavis!!
Silvermel - A Theme for Firefox and Thunderbird
YATT - Yet Another Theme Tutorial
Don't give a man a fish. Teach him how to fish instead.
Locked