Browser Backgrounding

Many browsers throttle the CPU usage of tabs open in the background. This causes Power-Up communication to be slowed drastically and causes them to be more prone to time outs. To mitigate potential problems, the Power-Up client library will only attempt to communicate with your Power-Up if the Trello board on which the Power-Up is enabled is visible.

Troubleshooting

It can be difficult to debug Power-Up errors that come from the web client because the stack traces are not particularly helpful.

To help with this, we're adding a new option to enable helpfulStacks. When used, it will create and store a stacktrace with each request that will be used if that request fails with an error.

This is a potentially expensive option to turn on so we recommend only using it for short periods of time when you need to know more information for debugging.

To turn it on, you can add it as an option when initializing the Power-Up:

1
2
window.TrelloPowerUp.initialize({
  'board-buttons': function (t, opts) { ... }
}, {
  helpfulStacks: true
});

Similarly, if you are in an iframe, you can turn it on with the following:

1
2
var t = TrelloPowerUp.iframe({ helpfulStacks: true });

---

As our platform grows, we are working on identifying the most common mistakes and problems.

Uncaught PluginRunner::NotHandled: attempt to run callback on plugin 55a5d917446f51777421000f failed(anonymous function) @ ltp.js:40603(anonymous function) @ ltp.js:37845 ltp.js:38699 ^--- With additional stack trace: PluginRunner::NotHandled: attempt to run callback on plugin 55a5d917446f51777421000f failed

Solution: Make sure you are specifying “callback” as one of your capabilities in your manifest.json file.

PostMessageIO::NotHandled: Invalid context, missing board

Solution: If a Power-Up has a stale, local context Trello will strip out the old context which leads to the client library issuing this warning. A Power-Up can get into this state if a new board is navigated to in the middle of a number of back and forth requests between Trello and the Power-Up. The connector iframe remains loaded on the new board, continuing to attempt its final requests with the old context, and then Trello catches the old context and removes it. You should see this warning rarely and it can be safely ignored.

Timeouts

When Trello makes a request to your Power-Up for a capability method or callback, it will wait a fixed amount of time for a reply before giving up. Your Power-Up should reply within one second - faster is better across all cases. Usually, Trello will stop waiting for a response after five seconds although requests to some capabilities may wait slightly longer.

Additionally, you should make sure that your manifest file and index connector can be loaded by Trello as quickly as possible. You should have these served within one second; Trello will stop waiting for a response after 10 seconds.

Webhooks and Offline Access

Webhooks and Offline Access are not currently part of the Power-Up architecture. Power-Ups are only active while a member is in the Trello web client experience. It is possible for your Power-Up and service to access a user’s information and create Webhooks using the standard API.

The way to accomplish this is for you to Authorize your application to the Trello API as a part of your Authorization flow, or in response to a user action. You would then need your service to use the standard Trello API to make offline requests.

For example, if you were building a Power-Up where you wanted to react to any change made to a card, the member’s experience could be as follows.

• Trello Member enables Magic Service Power-Up
• Trello Member clicks on the card-button to attach a Magic Service to a card.
• You prompt the member via an overlay iframe to authorize your service to access the member’s Trello account
• Your service stores the user’s token as part of a one-time authorization step
• Your service stores the Card’s ID as part of your card-button callback
• Your service creates a webhook based on Card ID
• Your Power-Up renders a new card-button for any cards that are already attached to your service
• When the user clicks the “detach” card-button, your service deletes the webhook

Markdown in Descriptions

The description you provide in the Power-Up admin portal will be used multiple places throughout Trello to share information to users about your Power-Up. It will be used in the Power-Up directory as seen here. This is the Dashcards Power-Up directory listing page.

It will also be used in future features like Power-Up landing pages, updates to the Power-Up menu, etc. Great Power-Ups include useful information about the Power-Up as well as gifs and screenshots of the Power-Up in action!

A Power-Up's description should be provided in the Power-Up admin portal. The description field accepts markdown, the same format as Trello card descriptions. You can read more about what is possible here.

For example, the Dashcards Power-Up's Description field looks like this:

1
2
Dashcards are a new Trello card type that helps keep track of what you and
your teams are doing. \n\n![Dashcards Screenshot](https://trellegi.services.atlassian.com/static/screenshot.png)
\n\nDashcards allows you to track any set of tasks across all the boards where you
work.\n\n- Select the cards you want to track by a combination of filters: label,
assignee, list, etc, or select one of the templates that solve common needs.\n- The
number of cards matched is shown on a Dashcard on your board. Dashcards update
automatically as the cards change.\n- Click on a Dashcard to see the cards that match the
filters, and further explore them.\n- Create multiple Dashcards to track tasks in
different stages of progress.\n\nA Dashcard is like any other card, so you can arrange
them on your boards for maximum visibility as you work. You can also assign
Dashcards to members of your team and comment on them as with any other
card.\n\n---\n\nWe hope Dashcards will become an important building block in making the state of
your work more visible and manageable, regardless of the way you choose to organize it.