How can I address the Samsung Android browser?

Question

I'm working on a responsive website and I have a weird CSS/JS issue with the default touchwiz browser of Android Samsung devices. I've searched on StackOverflow, finding some unhelpful answers like this.

I have the physical devices to test on, but since it's not possible to do remote debugging on these browsers it's really time consuming to make changes, deploy them a QA server, test, and retry.

Any idea on how can I speed up my testing or targeting that specific browsers?

Useragent is not helping in my case...

Just to make an example: one of the many problems I'm facing is on this free component, it's not positioning in the middle of the screen, while it's ok on all other android and iOS browsers.

And none of these problems happen on the stock android browser (even older versions like the 4.1 or even 2.3 browser) I assume? — Benjamin Gruenbaum, Dec 15 '14 at 13:36
Also - in my experience [this](http://stackoverflow.com/q/23786275/1348195) helps tramendously. Have you tried it? — Benjamin Gruenbaum, Dec 15 '14 at 13:37

score 2 · Accepted Answer · answered Dec 16 '14 at 05:12

For mobile testing, here are some resources might help.

Personally I prefer the Samsung emulator and Adobe Edge Inspect(will charge).

Adobe Edge Inspect
Samsung Emulators
Chrome - Device Mode & Mobile Emulation (recommended only for testing responsiveness)
Keynote (might charge fee)

Because the limit of the content length, Please click the links and see the detailed documentation.

Hope it will help to speed up the testing and debug on mobile devices.

score 2 · Answer 2 · answered Dec 18 '14 at 16:19

2

If you have a device I would suggest you to try this tool weinre It's allow you to remote debug. I always use it for stuff like that

answered Dec 18 '14 at 16:19

Ihor

3,219
2
18
20

videos at YouTube may be helpful: http://www.youtube.com/results?search_query=weinre – Ihor Dec 18 '14 at 16:22
The main feature of this tool - it is not depends on browser. To use it you have to run weinre server, just add script on your page and open this page in any browser you nee. Go to the debug page on your computer and see what's going on. That's it. – Ihor Dec 18 '14 at 16:30

score 0 · Answer 3 · edited May 23 '17 at 12:26

JSBin can take care of the JS debug. Combined with the CSSRule API and the following to grab the browser's default style values for an element and its current rendered values, you might be able to get somewhere.

function defaultStyle(tag) {
    var defaultStyles = {},
    testElem = document.createElement(tag),
    getStyle = 'getComputedStyle' in window,
    styles;

    document.body.appendChild(testElem);

    styles = (getStyle) ? window.getComputedStyle(testElem) : testElem.currentStyle;

    for (var prop in styles) {
        if (!(/^\d+$/.test(prop))) {
            defaultStyles[prop] = styles[prop];
        }
    }

    document.body.removeChild(testElem);

    return defaultStyles;
}

function currentStyle(elem) {
    var currentStyles = {},
    getStyle = 'getComputedStyle' in window,
    styles;

    styles = (getStyle) ? window.getComputedStyle(elem) : elem.currentStyle;

    for (var prop in styles) {
        if (!(/^\d+$/.test(prop))) {
            currentStyles[prop] = styles[prop];
        }
    }

    document.body.removeChild(testElem);

    return currentStyles;
}

score -5 · Answer 4 · answered Dec 15 '14 at 05:17

-5

Use media queries for making css based on screen lengths. It does not matter whether it is samsung or iphone browser. You can also use bootstrap libraries for it.

answered Dec 15 '14 at 05:17

yogihosting

5,494
8
47
80

I can use media queries. The problem is that I want to debug on those samsung custom browsers and the question is about how to speed up that. – napolux Dec 15 '14 at 07:54
You didn't understand the question. – napolux Dec 15 '14 at 10:46

How can I address the Samsung Android browser?

4 Answers4

Linked