Browser is getting crashed when navigating to the application due to panic error "unexpected end of JSON input"

[ostandsouza]

Brief summary

The browser(Chrome) crashes on navigation to the application. Below is the error
panic: GoError: parsing remote object value: unexpected end of JSON input

This is reproducible only in one application of ours, on other application it is working fine. My guess is probably one of api response is too long for it to parse.

Attached K6 logs with debug flag enabled.
log.txt

xk6-browser version

v0.80.0

OS

macOS 12.6

Chrome version

109.0.5414.119

Docker version and image (if applicable)

No response

Steps to reproduce the problem

import { chromium } from 'k6/x/browser';
import {sleep} from 'k6';

// export const options = { vus: 1, duration: '2m' }

export default function () {
    const browser = chromium.launch({ 
        args: [],
        headless: false, 
        debug: true,
        args: ['--start-maximized'],
        timeout: "60s",
        slowMo: "1000ms",
        proxy: {},
        env: {},
        executablePath: null,
        devtools: true
    });
    const context = browser.newContext({
        acceptDownloads: true,
        ignoreHTTPSErrors: true,
        JavaScriptEnabled: true,             // Whether to accept downloading of files by default
    });
    context.setDefaultNavigationTimeout(60)
    context.setDefaultTimeout(60)
    
    const page = context.newPage();

    page.goto(*applicationURL*, { waitUntil: 'networkidle' });

    page.waitForLoadState();
    page.waitForSelector("button.mat-focus-indicator>span")
    page.screenshot({path:'screenshots/01_LoginPage.png'})
   
}

Expected behaviour

Should be able to navigate and proceed with the rest of the execution.

Actual behaviour

Crashing on navigation itself

[angelo-loria]

Here's a reproducible example with xk6-browser 0.80.0 and k6 0.42.0

import { chromium } from 'k6/x/browser';

export default function () {
  const browser = chromium.launch({ headless: false });
  const page = browser.newPage();

  page
    .goto('https://apply.mykaleidoscope.com/')
    .then(() => {
        page.screenshot({ path: 'screenshot.png' });
    })
    .finally(() => {
      page.close();
      browser.close();
    });
}

Output:

ERRO[0001] "Loading the Google Maps JavaScript API without a callback is not supported: https://developers.google.com/maps/documentation/javascript/url-params#required_parameters"  source=browser-console-api
WARN[0001] url:https://js.stripe.com/v3/m-outer-93afeeb17bc37e711759584dbfc50d47.html method:GET err:fetching response body: No resource with given identifier found (-32000)  category="Response:bodySize:fetchBody" elapsed="0 ms" goroutine=318
WARN[0001] url:https://js.stripe.com/v3/fingerprinted/js/m-outer-8cb24ab2d649fd36a488d04d8c457933.js method:GET err:fetching response body: No resource with given identifier found (-32000)  category="Response:bodySize:fetchBody" elapsed="0 ms" goroutine=318
WARN[0002] url:https://m.stripe.network/inner.html method:GET err:fetching response body: No resource with given identifier found (-32000)  category="Response:bodySize:fetchBody" elapsed="0 ms" goroutine=74
WARN[0002] url:https://m.stripe.network/out-4.5.42.js method:GET err:fetching response body: No resource with given identifier found (-32000)  category="Response:bodySize:fetchBody" elapsed="0 ms" goroutine=74
WARN[0002] url:https://vars.hotjar.com/box-e031119f9e9e307a08fa610f85dbfb52.html method:GET err:fetching response body: No resource with given identifier found (-32000)  category="Response:bodySize:fetchBody" elapsed="0 ms" goroutine=649
WARN[0002] url:https://m.stripe.com/6 method:POST err:fetching response body: No resource with given identifier found (-32000)  category="Response:bodySize:fetchBody" elapsed="0 ms" goroutine=74
WARN[0002] "/!\\ You are using legacy implementaion. Please update your code: use createWrapper() and wrapper.withRedux()."  source=browser-console-api
WARN[0002] "/!\\ You are using legacy implementaion. Please update your code: use createWrapper() and wrapper.withRedux()."  source=browser-console-api
WARN[0002] "/!\\ You are using legacy implementaion. Please update your code: use createWrapper() and wrapper.withRedux()."  source=browser-console-api
WARN[0002] "/!\\ You are using legacy implementaion. Please update your code: use createWrapper() and wrapper.withRedux()."  source=browser-console-api
WARN[0002] "/!\\ You are using legacy implementaion. Please update your code: use createWrapper() and wrapper.withRedux()."  source=browser-console-api
WARN[0002] "/!\\ You are using legacy implementaion. Please update your code: use createWrapper() and wrapper.withRedux()."  source=browser-console-api
WARN[0002] "/!\\ You are using legacy implementaion. Please update your code: use createWrapper() and wrapper.withRedux()."  source=browser-console-api
WARN[0002] "/!\\ You are using legacy implementaion. Please update your code: use createWrapper() and wrapper.withRedux()."  source=browser-console-api
panic: GoError: parsing remote object value: unexpected end of JSON input
running (0m02.8s), 1/1 VUs, 0 complete and 0 interrupted iterations
goroutine 148 [running]:-------------------------] 1 VUs  02.8s/30s
go.k6.io/k6/js/common.Throw(0x140025cb6a0?, {0x1059e87c0?, 0x14000c13c80?})
        go.k6.io/k6@v0.42.1-0.20230130080633-582ec4d3940c/js/common/util.go:20 +0x54
github.com/grafana/xk6-browser/k6ext.Panic({0x1059f8108, 0x14002cd8030}, {0x1053ec04e, 0x1f}, {0x140010ea9b8?, 0x1, 0x1})
        github.com/grafana/xk6-browser@v0.0.0-00010101000000-000000000000/k6ext/panic.go:51 +0x27c
github.com/grafana/xk6-browser/common.handleParseRemoteObjectErr({0x1059f8108, 0x14002cd8030}, {0x1059e86c0?, 0x140001a2cd8}, 0xe746?)
        github.com/grafana/xk6-browser@v0.0.0-00010101000000-000000000000/common/remote_object.go:195 +0xcc
github.com/grafana/xk6-browser/common.(*FrameSession).onConsoleAPICalled(0x140024509a0, 0x1400127c190)
        github.com/grafana/xk6-browser@v0.0.0-00010101000000-000000000000/common/frame_session.go:530 +0x190
github.com/grafana/xk6-browser/common.(*FrameSession).initEvents.func1()
        github.com/grafana/xk6-browser@v0.0.0-00010101000000-000000000000/common/frame_session.go:249 +0x4f8
created by github.com/grafana/xk6-browser/common.(*FrameSession).initEvents
        github.com/grafana/xk6-browser@v0.0.0-00010101000000-000000000000/common/frame_session.go:208 +0x188

[ostandsouza]

Do we have any update on this? We're blocked for more than 2 weeks now. Kindly let us know if there are any alternatives available. Your suggestion is most welcome.

[ka3de]

Hi @ostandsouza,
Thank you for submitting this issue and apologies for late reply. Indeed looks like a bug, but we have to investigate this better. We'll get back to you once we have diagnosed the exact behavior and root cause.

[ka3de]

Hi @ostandsouza , we have diagnosed the issue. The website is printing some null messages in the console log and this are mishandled by xk6-browser implementation, resulting in the error that is shown in your cmdline output.

We have created an issue with more specific details. You can track it's progress here #793.

[ka3de]

Hi @ostandsouza and @angelo-loria , the fix for this issue has just been merged into main, but it won't be included in k6 until the next release. If you want you can use xk6 to build a custom version which includes k6 browser main version.