Protractor - run specific test as mobile device - angularjs

Question

I have a feature that acts differently for mobile web / desktop. My media query is running on device-width, for example:
#media only screen and (max-device-width: 1024px) {
...
}
This means that I cannot just change browser size (it will not work):
browser.manage().window().setSize(320, 480);//will not be affected by 'device-size' media query
I found an option to change chromeOptions on device capabilities. I tried using this with multiCapabilities:
'use strict';
var config = require('infra-gruntfile/protractor-conf').config;
// old capabilities
// config.capabilities = {
// browserName: 'chrome'
// };
config.multiCapabilities =
[
{
browserName: 'chrome',
name: 'Unnamed Job',
count: 1,
shardTestFiles: false,
maxInstances: 10,
chromeOptions: {
'mobileEmulation': {
'deviceName': 'Apple iPhone 4'
},
args: [
'incognito',
'disable-extensions'
]
},
loggingPrefs: {
browser: 'ALL'
},
specs: ['app/**/*.mobile.spec.js']
},
{
browserName: 'chrome',
specs: ['!app/**/*.mobile.spec.js']
}
]
module.exports.config = config;
It looks like specs doesn't work (I was trying different spec options) but all of them will run all test on both mobile/non mobile browser. I need the test mobile test to run only on mobile, while all others on regular browser.
Do I have a programatically way of doing this during my test (and not using config)?
What am I doing wrong with my current config? Why isn't specs working for me?

Answer 1

After reading this post I figured out that the problem is that the capability-specific specs are in addition to the main config.specs.
This means I have to remove the defaults arrived from my infrastructure config file, using specs: []
'use strict';
var config = require('infra-gruntfile/protractor-conf').config;
// old capabilities
// config.capabilities = {
// browserName: 'chrome'
// };
config.specs = []; //This line solved my problem!
config.multiCapabilities =
[
{
browserName: 'chrome',
name: 'Unnamed Job',
count: 1,
shardTestFiles: false,
maxInstances: 10,
chromeOptions: {
'mobileEmulation': {
'deviceName': 'Apple iPhone 4'
},
args: [
'incognito',
'disable-extensions'
]
},
loggingPrefs: {
browser: 'ALL'
},
specs: ['app/**/*.mobile.spec.js']
},
{
browserName: 'chrome',
specs: ['!app/**/*.mobile.spec.js']
}
]
module.exports.config = config;