How does the forge.tabbar work? The documented example is not working

Question

I have a standard Forge generated Trigger.io app, I made a separate one to test this.

I added the "tabbar: true" to the config.json, copied a image named "pencil@2x.png" to the "/img" directory, ands left everything else the same in all the other files. Also in the "default.js" I have:

forge.enableDebug();
forge.tabbar.addButton({
  icon: "img/pencil@2x.png",
  text: "Pencil"
}, function (button) {
  button.setActive();
  button.onPressed.addListener(function () {
    alert("My Stories");
  });
}, alert('Error'));

NOTE: The documentation here, is out of date it should say "forge.enableDebug();", not "window.forge.debug = true;"

I get no output in Catalyst, but I get the "Error" alert, and my console reads:

[   INFO] Showing log output:
2012-06-11 21:14:41.759 ios-sim-xc4.3[90599:507] stderrPath: /var/folders/d_/b7n2d1qn23z7zx2gfmhh22d80000gp/T/tmpsCqHJK
[   INFO] 2012-06-11 21:14:42.827 Forge[90605:1a603] [INFO] Device rotated.
[   INFO] 2012-06-11 21:14:42.844 Forge[90605:1a603] [INFO] Loading default page in webview.
[   INFO] 2012-06-11 21:14:42.850 Forge[90605:1a603] [INFO] Device rotated.
[   INFO] 2012-06-11 21:14:42.851 Forge[90605:1a603] [INFO] Device rotated.
[   INFO] 2012-06-11 21:14:42.861 Forge[90605:1a603] [INFO] Loading local url in webview: file:///Users/Name/Library/Application%20Support/iPhone%20Simulator/5.1/Applications/82F1256F-C533-4CD7-864B-74545EAE346A/simulator-ios.app/assets/src/index.html
[   INFO] 2012-06-11 21:14:49.518 Forge[90605:1a603] -[JKArray isEqualToString:]: unrecognized selector sent to instance 0x8fe30e0
[   INFO] 2012-06-11 21:14:49.519 Forge[90605:1a603] *** WebKit discarded an uncaught exception in the webView:decidePolicyForNavigationAction:request:frame:decisionListener: delegate: <NSInvalidArgumentException> -[JKArray isEqualToString:]: unrecognized selector sent to instance 0x8fe30e0

The tabbar shows up but there are no buttons on it.

Why am I getting these errors, and how can I fix it.

Answer 1

Firstly, thanks for pointing out that out-of-date FAQ entry - I've updated it our documentation accordingly.

I've tried the code snippet you pasted in and everything works as expected: I get "My Stories" alerts when I click on the button.

Note: I think you're trying to display the error alert if something goes wrong? To do so, change the error callback to:

function (err) { alert('Error'); }

As I can't recreate from your snippet, if you're still hitting an issue send a zip of your src directory to support@trigger.io we'd be happy to look at this some more!

Answer 2

"unrecognized selector sent to instance 0x8fe30e0" sounds to me like the "@" sign in your image name is messing things up.