Emulate a mobile or tablet device? Set userAgent to mobile?

Get help with testing, discuss unit testing strategies etc.
Post Reply
User avatar
klodoma
Posts: 44
Joined: Thu Oct 01, 2015 11:55 am

Emulate a mobile or tablet device? Set userAgent to mobile?

Post by klodoma » Thu Jun 13, 2019 8:01 am

Not sure if it's even possible, but maybe you can point out to the right direction.

In Chrome/FF, we can emulate a mobile device with different screensizes and which also sets the browser userAgent to the specific "tablet" or "phone" mode.
Ref to a generic user agent detection https://www.abeautifulsite.net/detecting-mobile-devices-with-javascript
Screenshot_387.png
Screenshot_387.png (64.16 KiB) Viewed 255 times

Is this possible to set the userAgent with siesta?
The screen size probably one could simulate by limiting the size of the view, but can we enforce the user agent?

I searched through the examples and found nothing in this direction.

The problem:
- same views behave/look differently on desktop/tablet and mobile
- currently we can see only the "desktop" mode

The use-case would be the following:
- the same view behaves differently on desktop, tablet and phone
- test this view on different modes(desktop, tablet and phone) and check if components are visible or not etc...

Can you provide some directions?

User avatar
mats
Core Developer
Core Developer
Posts: 14658
Joined: Sat Dec 19, 2009 11:41 pm
Location: Sweden
Contact:

Re: Emulate a mobile or tablet device? Set userAgent to mobile?

Post by mats » Thu Jun 13, 2019 1:27 pm

We don't support mocking the userAgent but you can set viewportWidth / height. Docs: https://www.bryntum.com/docs/siesta/#!/api/Siesta.Project.Browser-cfg-viewportHeight
Tired of debugging javascript errors in web applications? Try our new error logging service RootCause, or read more on the Sencha blog

@bryntum
Facebook
API documentation

User avatar
klodoma
Posts: 44
Joined: Thu Oct 01, 2015 11:55 am

Re: Emulate a mobile or tablet device? Set userAgent to mobile?

Post by klodoma » Thu Sep 05, 2019 5:53 pm

mats wrote:
Thu Jun 13, 2019 1:27 pm
We don't support mocking the userAgent but you can set viewportWidth / height. Docs: https://www.bryntum.com/docs/siesta/#!/api/Siesta.Project.Browser-cfg-viewportHeight
It works if I set the viewportWidth during configuration.

I found a way to set the userAgent to mobile, is it possible to change the viewportWidth/Height for each test or before each test? Or the test should set the values.

I tried to manipulate the iframe width/height after a test kicks off, but it leads to some layout side-effects.

Code: Select all

        window.parent.$('iframe').width(300);
        window.parent.$('iframe').height(700);

User avatar
klodoma
Posts: 44
Joined: Thu Oct 01, 2015 11:55 am

Re: Emulate a mobile or tablet device? Set userAgent to mobile?

Post by klodoma » Thu Sep 05, 2019 6:10 pm

Is this the way?

Code: Select all

StartTest(function (t) {
    t.setWindowSize(300, 700);

User avatar
nickolay
Core Developer
Core Developer
Posts: 3357
Joined: Mon May 16, 2011 10:48 am

Re: Emulate a mobile or tablet device? Set userAgent to mobile?

Post by nickolay » Fri Sep 06, 2019 3:33 pm

Yes, this should do it.
We offer training in both Ext JS and our products, read more here.
Read the API documentation

Post Reply