Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

1.18.1 - Uncaught SyntaxError: Unexpected token < in JSON at position 0

See original GitHub issue

What is your Scenario?

We added SSL to our site and disabled the skip-js-errors flag in order to start catching legitimate JS errors. We are now encountering some errors that are stopping our tests and they appear to be related to hammerhead.js.

What is the Current behavior?

Uncaught SyntaxError: Unexpected token < in JSON at position 0
    at parse (<anonymous>)
    at Function.t._getMessageData (hammerhead.js:14:16568)
    at t._onMessage (hammerhead.js:14:16699)
    at zs (hammerhead.js:2:23963)
    at n (hammerhead.js:14:17932)
    at hammerhead.js:12:1540
    at HTMLElement.dispatchEvent (hammerhead.js:13:29080)
    at HTMLElement.value (vendors~eva~light-9c92a2a7bb23d1b46f26.chunk.js:2:472330)
    at actioncable-1c7a56a3901da2c6616e.chunk.js:2:10902
    at Array.map (<anonymous>)

Uncaught TypeError: Cannot read properties of null (reading 'document')
    at s (frame-modern.f38882d2.js:2:147991)
    at Object.read (frame-modern.f38882d2.js:2:104408)
    at frame-modern.f38882d2.js:2:290524
    at session_Session.createOrUpdateUser (frame-modern.f38882d2.js:2:290662)
    at app_App.createOrUpdateUser (frame-modern.f38882d2.js:2:312987)
    at Object.update (frame-modern.f38882d2.js:2:316383)
    at zs (hammerhead.js:2:23817)
    at value (hammerhead.js:13:2013)
    at frame-modern.f38882d2.js:2:317536
    at <anonymous>:5:649

What is the Expected behavior?

No JS error so that our tests only stop when the site that we are testing throws a valid JS error.

What is your public website URL? (or attach your complete example)

https://accounts.reborncf.com/users/sign_in

What is your TestCafe test code?

Sent via email.

Your complete configuration file

let filtered_tests = [
    // Located in editor_page_tests.js
    'user_is_able_to_add_a_section_column_row_and_element_to_editor', 
    'pop_up_element_displays_during_page_preview',
    'clicking_button_shows_hides_elements',
    'user_is_able_to_save_when_adding_a_video',
    'user_is_able_to_save_when_leaving_video_embed_blank',

    // Located in courses_page_tests.js
    'user_can_preview_existing_course',
    'optin_user_can_navigate_through_course',
    'manually_added_user_can_navigate_through_course',
    
    // Located in funnels_page_tests.js
    'user_can_navigate_through_funnel',

    // Located in developer_portal_page_tests.js
    'user_can_navigate_to_developer_portal_page',

    // Located in members_page_tests.js
    'user_can_navigate_to_team_members_page',

    // Located in teams_dashboard_pages_tests.js
    'user_can_navigate_to_team_dashboard_page',

    // Located in workspaces_page_tests.js
    'user_can_navigate_to_team_workspaces_page'
]

let isolated_tests = [
    // Located in sites_overview_page_tests.js
    'user_can_make_site_public',
    'user_can_edit_site_name',
    'user_can_make_site_password_protected',
    'user_can_make_site_private',
    'user_can_edit_site_domain',
    'changing_site_domain_updates_funnel_urls',

    // Located in account_details_page_tests.js
    'user_can_edit_account_name',

    // Located in account_details_page_tests.js
    'user_can_edit_account_password',

    // Located in general_page_tests.js
    'user_can_edit_workspace_details'
]

let full_filter = filtered_tests.concat(isolated_tests)

let build_filter = () => {

    // Purpose: To set the suite that we want to run. (Sanity, Smoke, Regression)

    var filter = {}
        if(process.env.SCOPE) {
            filter = {
                testGrep: `^(?!.*(${filtered_tests.join('|')})).*$`,
                testMeta: {
                    scope: process.env.SCOPE
                }
            }
        } else {
            filter = {
                testGrep: `^(?!.*(${full_filter.join('|')})).*$`
            }
        }

    return filter
}

let determine_concurrency = () => {

    // Purpose: To set concurrency dependant on the scope that is passed
    
    let concurrency = 5
    if (process.env.SCOPE == 'isolated') {
        concurrency = 1
    } 
    return concurrency
}

module.exports = {
    assertionTimeout: 5000,
    browsers: [
        "chrome:headless --window-size=1920,1159 --allow-insecure-localhost"
    ],
    concurrency: determine_concurrency(),
    cache: true,
    // clientScripts: "scripts/hide_notifications.js", // TODO: Update with listener
    filter: build_filter(),
    hostname: "localhost",
    pageLoadTimeout: 30000,
    quarantineMode: {
        successThreshold: 1,
        attemptLimit: 3
    },
    reporter: [
        {
            name: "spec",
            output: "artifacts/reports/spec_results"
        },
        {
            name: "xunit",
            output: "artifacts/reports/xunit_results.xml"
        }
    ],
    screenshots: {
        path: "artifacts/screenshots",
        pathPattern: "${TEST}_${DATE}_${TIME}.png",
        takeOnFails: true,
        thumbnails: false
    },
    selectorTimeout: 5000,
    skipJsErrors: false,
    skipUncaughtErrors: true,
    src: "tests/**",
    ssl: {
        pfx: "ssl/testingdomain.pfx",
        rejectUnauthorized: true
    },
    videoEncodingOptions: {
        aspect: "16:9",
        framerate: 30
    },
    videoOptions: {
        failedOnly: true,
        pathPattern: "${TEST}_${DATE}_${TIME}.mp4",
        singleFile: false
    },
    videoPath: "artifacts/recordings"
}

Your complete test report

Running tests in:
 - Chrome 97.0.4692.71 / macOS 10.15.7

 marketing - workflows
 ✖ user_can_create_a_workflow (screenshots:
 /Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/artifacts/screenshots/user_can_create_a_workflow_2022-01-18_13-50-36.png)

   1) - Error in test.after hook -
      A JavaScript error occurred on

   "[REDACTED]".
      Repeat test actions in the browser and check the console for errors.
      To ignore client-side JavaScript errors, enable the
      "--skip-js-errors" CLI option, or set the "skipJsErrors"
      configuration file property to "true".
      If the website only throws this error when you test it with
      TestCafe, please create a new issue at:

   "https://github.com/DevExpress/testcafe/issues/new?template=bug-report.md".

      JavaScript error details:
      Script error.
          No stack trace available

      Browser: Chrome 97.0.4692.71 / macOS 10.15.7
      Screenshot:

   /Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/artifacts/screenshots/user_can_create_a_workflow_2022-01-18_13-50-36.png

         32 |        // Purpose: To delete a workflow that was just
      created
         33 |        // Param: workflow_name
         34 |
         35 |        await t
         36 |

   .click(Selector('table').find('td').withText(workflow_name).sibling('td').find('a').withAttribute('title',
      'Archive'))
       > 37 |            .click(this.btn_proceed)
         38 |
         39 |        while(Selector('table').visible == false) {
         40 |            await t
         41 |                .wait(250)
         42 |        }

         at <anonymous>

   (/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/pom/workflows_page_repo.js:37:14)
         at asyncGeneratorStep

   (/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/pom/workflows_page_repo.js:1:298)
         at _next

   (/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/pom/workflows_page_repo.js:1:636)
         at <anonymous>

   (/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/pom/workflows_page_repo.js:1:801)
         at <anonymous>

   (/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/pom/workflows_page_repo.js:1:542)
         at WorkflowsPageObjects.delete_workflow

   (/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/pom/workflows_page_repo.js:30:41)
         at <anonymous>

   (/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/tests/marketing/workflows_page_tests.js:54:36)
         at asyncGeneratorStep

   (/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/tests/marketing/workflows_page_tests.js:7:286)
         at _next

   (/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/tests/marketing/workflows_page_tests.js:7:624)
         at <anonymous>
      (/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/tests/marketing/workflows_page_tests.js:7:789)



 1/1 failed (12m 48s)

 Warnings (3):
 --
  The "browsers", "concurrency", and "filter" options from the configuration
  file will be ignored.
 --
  Video recording is not supported by the "chrome --window-size=1920,1159"
  browser.
 --
  The file at
  "/Users/justingrabenbauer/Clickfunnels/cf2-test-cafe-poc/artifacts/screenshots/user_can_create_a_workflow_2022-01-18_13-50-36.png"
  already exists. It has just been rewritten with a recent screenshot. This
  situation can possibly cause issues. To avoid them, make sure that each
  screenshot has a unique path. If a test runs in multiple browsers, consider
  including the user agent in the screenshot path or generate a unique
  identifier in another way.

Screenshots

https://d.pr/i/kZUvmJ

Steps to Reproduce

Clone codebase
Run npm install
Run ENV=staging testcafe "chrome '--window-size=1920,1159'" -t 'user_can_create_a_workflow' -c1
View console during run.