MDN will be in maintenance mode on Friday September 22nd, starting at 10 AM Pacific / 5 PM UTC, for about 1 hour.

Add-ons

Snackbars.jsm

Add-ons using the techniques described in this document are considered a legacy technology in Firefox. Don't use these techniques to develop new add-ons. Use WebExtensions instead. If you maintain an add-on which uses the techniques described here, consider migrating it to use WebExtensions.

Starting from Firefox 53, no new legacy add-ons will be accepted on addons.mozilla.org (AMO) for desktop Firefox and Firefox for Android.

Starting from Firefox 57, only extensions developed using WebExtensions APIs will be supported on Desktop Firefox and Firefox for Android.

Even before Firefox 57, changes coming up in the Firefox platform will break many legacy extensions. These changes include multiprocess Firefox (e10s), sandboxing, and multiple content processes. Legacy extensions that are affected by these changes should migrate to use WebExtensions APIs if they can. See the "Compatibility Milestones" document for more information.

A wiki page containing resources, migration paths, office hours, and more, is available to help developers transition to the new technologies.

The Snackbars object is only available to privileged code running on Firefox for Android, and is intended for use by Firefox for Android add-ons.

NOTE: Snackbars.jsm will replace NativeWindow.toast in Firefox 45. To maintain backward compatibility NativeWindow.toast will still return a reference to the Snackbars object, but new code should use the new JSM.

Summary

Contains the Snackbars object, which can be used to show notifications to let users know that some change has been made. 

First, to use Snackbars you will need to import the Snackbars module:

Components.utils.import("resource://gre/modules/Snackbars.jsm");

To show a Snackbar you will need to call the Snackbars.show() function.

Example

The following example shows a Snackbar notification with the message "Don't press this button" with a duration of LONG with a button next to it with the label "Try me!".  A callback function is also set to be activated when the user taps the button, and the function writes "Told you not to click me." to the error log.

Snackbars.show("Don't press this button", Snackbars.LENGTH_LONG, {
  action: {
    label: "Try me!",
    callback: function() {
      Cu.reportError("Told you not to click me.");
    }
  }
});

Methods

show()

show(message, duration, action);

Shows a Snackbar.

Arguments

message
A string containing the message that will show in the Snackbar.
duration
The amount of time the Snackbar appears on the screen (Snackbars.LENGTH_LONG, Snackbars.LENGTH_SHORT, or Snackbars.LENGTH_INDEFINITE)
action
Optional: The action object describes the Snackbar button.  It may contain:
Attribute Description
label The text shown in the action button
callback A function that is called when the button is clicked

Document Tags and Contributors

 Contributors to this page: rebloor, andrewtruongmoz, nalexander, wbamberg, alex_johnson
 Last updated by: rebloor,