5 ms·

Firefox Add-on Enables Web Development Across Browsers and Devices

277 points by rnyman 12y ago

bobajeff 12y ago
I know I'm probably the only one but I really wish they'd have Dev Tools that you can use on the device instead of remote debugging. Especially on Tablets and Set-top boxes.
- Uehreka 12y ago
  If you have a Mac, you can use the remote web inspector for iOS, it works pretty well. http://moduscreate.com/enable-remote-web-inspector-in-ios-6/ http://moduscreate.com/enable-remote-web-inspector-in-ios-6/
  - toni 12y ago
    I think you misunderstood what he is asking about. He wants to debug locally on a tablet or a set-top box. The method you mentioned is remote debugging, something he explicitly wishes not to do.
  - Igglyboo 12y ago
    He specifically said that a remote debugger is the opposite of what he wants.
- janjongboom 12y ago
  Firefox for Android supports plugins, I guess you can install Firebug for it. For other browsers: Firebug Lite. It's a purely HTML version of Firebug.
- zz1 12y ago
  You're not alone! I wish Firefox for Android would allow you to view the source code.
  - merryandrew 12y ago
    view-source:https://news.ycombinator.com https://news.ycombinator.com
    - icebraining 12y ago
      I can confirm, this works fine. You can probably turn it into a bookmarklet, too.
    - zz1 12y ago
      Gee, thanks!
- morenoh149 12y ago
  why? wouldn't the screen be too small to make any sense of the info? maybe if you can switch between the dev tools and the site super fast, otherwise you have to view the site and the dev tools side by side on a small screen
  - bobajeff 12y ago
    Modal Dev Tools, that's actually really a good idea on phones (screen size isn't a problem on tablets and STBs). I believe a horizontal swipe could show or close the tools. That way you can still select the element in the content window and look back at the source. Since non-developers might get bogged down with it I'd suggest it be option you tick on in settings.
    - untog 12y ago
      But how is that better than remote debugging? When are you coding without bring at a computer?
      - harlanlewis 12y ago
        Coding on things other than a computer gets a little easier when the tools exist :) I've made quick pushes via web IDE on my phone while commuting. I doubt improved tooling would increase frequency, but it would certainly increase the complexity I'd be capable of and my confidence in not pushing janky brokenness.
- martius 12y ago
  I'm not sure but I think someone is working on that at mozilla. It is almost dedicated to things specific to mobile, though.
- steveax 12y ago
  Ugg, set top box debugging. I feel you pain. Have you looked at weinre[1]? [1]: http://people.apache.org/~pmuellr/weinre/ http://people.apache.org/~pmuellr/weinre/
- soapdog 12y ago
  Firefox OS has a lot of developer tools in the device :-) from HUD displays showing things such as memory usage, reflows, repaints and fps to console. Since Firefox OS and Firefox for Android run the same engine its very easy to switch between them to test stuff.
BrindsleyQuives 12y ago
Stopped reading at 'Arse-Sum'
deleted 12y ago
[deleted]
bsimpson 12y ago
Kudos to Mozilla for tackling a huge pain point (having to learn three sets of dev tools because each browser speaks its own protocol sucks). I'm most familiar with the WebKit/Chrome Dev Tools, and found this awesome project via Mozilla's post: https://github.com/google/ios-webkit-debug-proxy https://github.com/google/ios-webkit-debug-proxy If it works as advertised, it'll let you connect to iOS browsers from Chrome Dev Tools. Honestly, I'm surprised they don't have a version of this compiled into Chrome for iOS.
- bsimpson 12y ago
  Unfortunately, I couldn't get it to work: https://github.com/google/ios-webkit-debug-proxy/issues/72 https://github.com/google/ios-webkit-debug-proxy/issues/72
- joshschreuder 12y ago
  If you're on Windows I've been able to do this with Telerik's AppBuilder (http://docs.telerik.com/platform/appbuilder/debugging-your-code/debugging-on-device/prerequisites-for-debugging#ios-requirements http://docs.telerik.com/platform/appbuilder/debugging-your-c...) It opens up a Webkit Dev Tools that are pretty close to the latest Chrome version and lets you interact with Safari on iOS. Even highlights elements the same as desktop.
- thejosh 12y ago
  Have you tried Weinre?
varkson 12y ago
If this was the Chrome dev tools I'd be very very happy.
Aldo_MX 12y ago
There is a port of ios-webkit-debug-proxy for Win32: https://github.com/artygus/ios-webkit-debug-proxy-win32 https://github.com/artygus/ios-webkit-debug-proxy-win32 So in theory, the Firefox Tools Adapter should also be capable of debugging Safari iOS in Windows
- canuckistani 12y ago
  Thanks - we're definitely interested in Windows support and will take a look at this.
redact207 12y ago
I've been working on something similar this year (https://www.entomic.com https://www.entomic.com) that helps developers build cross-browser, responsive sites. As an editor, all changes update immediately on all connected browsers and devices as they're being made to help see when things start going wrong. Although it doesn't support javascript yet, all HTML and CSS changes do get pushed instantly to connected devices without the need to host a local server.
- Cowicide 12y ago
  If you don't mind me asking, why did you choose to use a subscription model instead of a license that allows customers to own the app and just pay for updates if they need them? The subscription fee makes me hesitant to even try it. I like owning my tools, not renting them.

277 points by rnyman 12y ago

I know I'm probably the only one but I really wish they'd have Dev Tools that you can use on the device instead of remote debugging. Especially on Tablets and Set-top boxes.

Uehreka 12y ago
If you have a Mac, you can use the remote web inspector for iOS, it works pretty well. http://moduscreate.com/enable-remote-web-inspector-in-ios-6/ http://moduscreate.com/enable-remote-web-inspector-in-ios-6/
- toni 12y ago
  I think you misunderstood what he is asking about. He wants to debug locally on a tablet or a set-top box. The method you mentioned is remote debugging, something he explicitly wishes not to do.
- Igglyboo 12y ago
  He specifically said that a remote debugger is the opposite of what he wants.
janjongboom 12y ago
Firefox for Android supports plugins, I guess you can install Firebug for it. For other browsers: Firebug Lite. It's a purely HTML version of Firebug.
zz1 12y ago
You're not alone! I wish Firefox for Android would allow you to view the source code.
- merryandrew 12y ago
  view-source:https://news.ycombinator.com https://news.ycombinator.com
  - icebraining 12y ago
    I can confirm, this works fine. You can probably turn it into a bookmarklet, too.
  - zz1 12y ago
    Gee, thanks!
morenoh149 12y ago
why? wouldn't the screen be too small to make any sense of the info? maybe if you can switch between the dev tools and the site super fast, otherwise you have to view the site and the dev tools side by side on a small screen
- bobajeff 12y ago
  Modal Dev Tools, that's actually really a good idea on phones (screen size isn't a problem on tablets and STBs). I believe a horizontal swipe could show or close the tools. That way you can still select the element in the content window and look back at the source. Since non-developers might get bogged down with it I'd suggest it be option you tick on in settings.
  - untog 12y ago
    But how is that better than remote debugging? When are you coding without bring at a computer?
    - harlanlewis 12y ago
      Coding on things other than a computer gets a little easier when the tools exist :) I've made quick pushes via web IDE on my phone while commuting. I doubt improved tooling would increase frequency, but it would certainly increase the complexity I'd be capable of and my confidence in not pushing janky brokenness.
martius 12y ago
I'm not sure but I think someone is working on that at mozilla. It is almost dedicated to things specific to mobile, though.
steveax 12y ago
Ugg, set top box debugging. I feel you pain. Have you looked at weinre[1]? [1]: http://people.apache.org/~pmuellr/weinre/ http://people.apache.org/~pmuellr/weinre/
soapdog 12y ago
Firefox OS has a lot of developer tools in the device :-) from HUD displays showing things such as memory usage, reflows, repaints and fps to console. Since Firefox OS and Firefox for Android run the same engine its very easy to switch between them to test stuff.

BrindsleyQuives 12y ago

Stopped reading at 'Arse-Sum'

deleted 12y ago

[deleted]

bsimpson 12y ago

Kudos to Mozilla for tackling a huge pain point (having to learn three sets of dev tools because each browser speaks its own protocol sucks). I'm most familiar with the WebKit/Chrome Dev Tools, and found this awesome project via Mozilla's post: https://github.com/google/ios-webkit-debug-proxy https://github.com/google/ios-webkit-debug-proxy If it works as advertised, it'll let you connect to iOS browsers from Chrome Dev Tools. Honestly, I'm surprised they don't have a version of this compiled into Chrome for iOS.

bsimpson 12y ago
Unfortunately, I couldn't get it to work: https://github.com/google/ios-webkit-debug-proxy/issues/72 https://github.com/google/ios-webkit-debug-proxy/issues/72
joshschreuder 12y ago
If you're on Windows I've been able to do this with Telerik's AppBuilder (http://docs.telerik.com/platform/appbuilder/debugging-your-code/debugging-on-device/prerequisites-for-debugging#ios-requirements http://docs.telerik.com/platform/appbuilder/debugging-your-c...) It opens up a Webkit Dev Tools that are pretty close to the latest Chrome version and lets you interact with Safari on iOS. Even highlights elements the same as desktop.
thejosh 12y ago
Have you tried Weinre?

varkson 12y ago

If this was the Chrome dev tools I'd be very very happy.

Aldo_MX 12y ago

There is a port of ios-webkit-debug-proxy for Win32: https://github.com/artygus/ios-webkit-debug-proxy-win32 https://github.com/artygus/ios-webkit-debug-proxy-win32 So in theory, the Firefox Tools Adapter should also be capable of debugging Safari iOS in Windows

canuckistani 12y ago
Thanks - we're definitely interested in Windows support and will take a look at this.

redact207 12y ago

I've been working on something similar this year (https://www.entomic.com https://www.entomic.com) that helps developers build cross-browser, responsive sites. As an editor, all changes update immediately on all connected browsers and devices as they're being made to help see when things start going wrong. Although it doesn't support javascript yet, all HTML and CSS changes do get pushed instantly to connected devices without the need to host a local server.

Cowicide 12y ago
If you don't mind me asking, why did you choose to use a subscription model instead of a license that allows customers to own the app and just pay for updates if they need them? The subscription fee makes me hesitant to even try it. I like owning my tools, not renting them.