Get HTTP requests (performance logs) from chromedriver with protractor

Question

I'm using protractor for my e2e tests with angular and I'm trying desperately to get HTTP requests logs with headers and body. I've configured protractor like this:

  {

    useAllAngular2AppRoots: true,
    ignoreUncaughtExceptions: true,

    maxSessions: 1,
    multiCapabilities: [
        {
            'name': 'desktop',
            'browserName': 'chrome',
            loggingPrefs: {"driver": "ALL", "browser": "ALL", 'performance': 'ALL'},
            chromeOptions: {
                binary: process.env.CHROME_BIN,
                args: ["--headless", "--disable-gpu", "--no-sandbox"],
                perfLoggingPrefs: {
                    'traceCategories': 'blink.console,disabled-by-default-devtools.timeline'
                }
            }
        }
    ],

    framework: "custom",
    frameworkPath: require.resolve("protractor-cucumber-framework"),

    //...
};

After each scenario, I'm executing this hook:

browser.manage().logs().get("browser").then(logs => 
  //...
)

But all I get are console logs but no http requests. Is there any way to get those from chromedriver within protractor?

Here is a link to chromedriver doc mentioning performance logs: https://sites.google.com/a/chromium.org/chromedriver/logging/performance-log

Answer 1

You will need to add the following chromeOptions including perfLoggingPrefs and loggingPrefs as shown in https://github.com/angular/protractor-cookbook/blob/master/protractor-javascript/example-network/conf.js

capabilities: {
    'browserName': 'chrome',
    'chromeOptions': {
      'perfLoggingPrefs': {
        'enableNetwork': true,
        'enablePage': false,
        'enableTimeline': false
      }
    },
    loggingPrefs: {
      performance: 'ALL',
      browser: 'ALL'
    }
  },

When getting the logs, the example I wrote has the logging in an afterEach method to output after each test.

  afterEach(() => {
    browser.manage().logs().get('performance').then((browserLogs) => {
      browserLogs.forEach((browserLog) => {
        var message = JSON.parse(browserLog.message).message;
        if (message.method == 'Network.responseReceived') {
          console.log(message);
        }
      });
    });
  });

From the logs you should be able to see any get requests made when loading javascript files, assets, etc.

Updated answer

Updating answer per comment. If you use 'Network.requestWillBeSent', you can view POSTs.