Problem with path while loading a file for testing

[kalwalt]

I am the jsartoolkitNFT maintainer and creator, i added in the past qunit test with Grunt but i would use instead Karma with karma-qunit. JsartoolkitNFT is a small lib for WebAR and it's necessary to load some config parameter files for the set up. I developed some testing to load the camera_para.dat file but i add to 'force' the path to an unusual "./base/tests/camera_para.dat"; normally it's only necessary this path "./camera_para.dat". Anyway with "./base/tests/camera_para.dat"; the test goes well instead if replace with "./camera_para.dat", tests are failing. This is my structure in tests folder:

• camera_para.dat
• index.html
• tests.js my karma.conf.js file:

// Karma configuration
// Generated on Mon Mar 07 2022 12:03:44 GMT+0100 (Ora standard dell’Europa centrale)

module.exports = function(config) {
  config.set({

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '',

    // frameworks to use
    // available frameworks: https://www.npmjs.com/search?q=keywords:karma-adapter
    frameworks: ['qunit'],

    plugins: [
      'karma-qunit',
      'karma-chrome-launcher'
    ],

    // list of files / patterns to load in the browser
    files: [
      { pattern: 'build/artoolkitNFT.min.js', included: true },
      { pattern: 'tests/*.js', included: true },
      { pattern: 'tests/camera_para.dat', watched: false, included: false, served: true, nocache: false }
    ],

    // list of files / patterns to exclude
    exclude: [
    ],

    // preprocess matching files before serving them to the browser
    // available preprocessors: https://www.npmjs.com/search?q=keywords:karma-preprocessor
    preprocessors: {
    },

    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://www.npmjs.com/search?q=keywords:karma-reporter
    reporters: ['progress'],

    // web server port
    port: 9876,

    // enable / disable colors in the output (reporters and logs)
    colors: true,

    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,

    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,

    // start these browsers
    // available browser launchers: https://www.npmjs.com/search?q=keywords:karma-launcher
    browsers: [
      //'Firefox', 
      'Chrome', 
      ],

    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false,

    // Concurrency level
    // how many browser instances should be started simultaneously
    concurrency: Infinity,

    client: {
      clearContext: false,
      qunit: {
        showUI: true,
        testTimeout: 5000
      }
    }

  })
}

Does it is correct? I have the feeling that i missed something, but searching on the docs can't find anything else. Thank you, Walter.

[kalwalt]

Additional informations: You can browse my PR https://github.com/webarkit/jsartoolkitNFT/pull/126

[Krinkle]

Hi @kalwalt,

This is not an issue with QUnit or karma-qunit, but part of how Karma works in general. As such, this is not something we control. I have expressed my preference to change this in Karma at https://github.com/karma-runner/karma/issues/1607.

Nonetheless, I will try to help. Karma creates its own HTML page instead of using one that you manually create yourself. From the PR, I understand you know this already. This automatic HTML page loads the included files as scripts, with the URLs automatically created relative to the basePath, which is generally the root directory of the repository, the same place as where karma.conf.js and package.json are.

What you perhaps have not yet noticed is that this automatic HTML page is served to the browser as the virtual file /index.html. This is different from the real file you had before, which was at /test/index.html. As such, a relative URL like ./foo.dat in your code will be relative to / instead of /test/. This is not something that can be changed. Consider the HTML page as existing virtually at /index.html, so you will need to consider test URLs as relative to / now.

On top of that, Karma also serves other files from its own web server. The files from your repository are served from /base/ by default, so /test/foo.dat is available at /base/test/foo.dat. For most requests this is automatically translated for you.

In some cases, a project needs to fetch additional files during the test. I know of a few different options to make this easy:

1. Specify the directory in proxies (docs). For example, tell Karma that /test/ should go to /base/test/. (This is fine so long as the directory name doesn't conflict with Karma's own server.) Example at https://github.com/karma-runner/karma/issues/2917#issuecomment-496473358.
2. Specify the entire server to proxy your base, by setting proxies: { "/": "/base/" }. In this case you will likely need to set urlRoot: as well. For example, urlRoot: "/_karma/". If that doesn't work, the proxy may need to map / to /_karma/base/. That would make requests to /test/foo.dat work transparently without needing to change the JavaScript code.
3. By using window.__karma__ in a conditional statememt. For example, in your test code you can define base = (window.__karma__ ? '/base/' : '/') and use that as prefix in your requests.
4. If these test files are only used with Karma, you can accomodate its base path in the same way you already have in your PR, by specifying /base/test/ as the actual URL.

[kalwalt]

Thank you @Krinkle for the long answer! Your comments were very helpful to me, at the end i left the path as you described in the 4. point, but maybe i will test also the other solutions.

[kalwalt]

@Krinkle I want also say that helped me a lot your https://github.com/Krinkle/example-node-and-browser-qunit-ci it is a good reference. I had an issue because i had setup singleRun: false, and the action github runner was hanging waiting forever, i din't realize it until i looked into your karma.conf.js again and i solved. Thank you again!