karma-webpack Issue with entry names being hashed

Operating System: Ubuntu 18.10
Node Version: v14.15.4
NPM Version: 6.14.10
webpack Version: ^5.23.0
karma-webpack Version: ^5.0.0

Feature Proposal

Hello,

i have an issue when updating karma-webpack, my entry names are not respected, if for exemple i say that my entry names are :

[
'abc',
'abcd'
]

a hash get happended and it breaks everything :

[
'abc.1491000527',
'abcd.2882415412'
]

Feature Use Case

I want to disable hash and have my entry names as is.

something like that :

function getPathKey(filePath, withExtension = false, hash = false) {
  const pathParts = path.parse(filePath);
  let key = `${pathParts.name}`;
  if(hash) {
   key += `.${hash(filePath)}`
  }
  return withExtension ? `${key}${pathParts.ext}` : key;
}

edit:

and there is an issue with the hash itself, if the project is stored at a different location, the hash will change, so it's not predictable.

thanks.

Feb 22 '21 14:02 lk77

Why is this necessary in your case, is there reasoning beyond preference?

Feb 23 '21 01:02 codymikol

well if there is a hash i can't predict the file location, and i can't use the file,

for example, i have this in my html:

<script type="text/javascript" src="/tmp/_karma_webpack_/abcd.js"></script>

but now the file can be :

/tmp/_karma_webpack_/abcd.2882415412.js
/tmp/_karma_webpack_/abcd.8187410404.js

or whatever the hash is

Feb 23 '21 08:02 lk77

This seems like an edge case that I don't think we are going to support. Can you shed more light as to why you might want to hard code references to the temporary karma-webpack files? Are you trying to create / reference variables on the global object?

Feb 23 '21 17:02 codymikol

I don't want to hardcode anything, i just want to use the file, aka execute the file in a browser via karma.

From my point of view an app is composed of a css bundle and a js bundle, and i need to load these files for my app to work

i could perhaps use window.__karma__.files to guess the file name with a regex but it does not seems clean to me.

the other solution would be to call webpack-cli directly to build my app, but this does not seems clean too :

require('child_process').exec('webpack --config tests/utils/webpack.config.karma.js"');

module.exports = function (config) {
    config.set({
        [...]
   })

but this would bypass karma-webpack so i don't see the point and i don't know if it could work.

Feb 24 '21 08:02 lk77

Could you provide me with a minimal example of how you might test in this way?

My usual setup would be something like

import AdvancedMath from './js-source-example';

describe('bundled js content', () => {
  it('should be able to bundle js content', () => {
    assert.equal(!!AdvancedMath.add, true);
  });
  it('should be able to interpret bundled js content', () => {
    assert.equal(AdvancedMath.add(1, 1), 2);
  });
});

This is actually taken directly from one of the integration tests. All of the imports are relative and there is no need to interact with the created temporary files that karma outputs.

Feb 25 '21 00:02 codymikol

I have a .spec.html file and a .spec.ts file :

<html class="h-full overflow-hidden">
    <head>
        <link href="/absolute/tmp/_karma_webpack_/abcd.bundle.css" rel="stylesheet" />
    </head>
    <body>
        <div id="abcd"></div>
        <script src="/absolute/tmp/_karma_webpack_/abcd.js"></script>
    </body>
</html>


describe("abcd e2e tests", () => {
    beforeAll(function(done) {
        jasmine.addMatchers(DOMCustomMatchers);

        karmaHTML.abcd.onstatechange = function(ready: Boolean) {
            if (ready) {
                done();
            }
        };
        karmaHTML.abcd.open({ width: "1920", height: "1080" });
    });

    it("has correct text", () => {
       let someElement = karmaHTML["abcd"].document.querySelector("#someElement");

        expect(someElement.innerText).toBe('SomeText');
    });
});

i'm using karma-html to load the html files

Feb 25 '21 09:02 lk77

I need a file without a hash as I am testing commands for the webworker. For [email protected], I could declare:

new Worker ('base / test / worker.js')

But in the new version, I cannot link to a specific file.

Mar 10 '21 18:03 plohoj

i made a fork to resolve my issue : https://github.com/lk77/karma-webpack

until it gets resolved here.

Mar 11 '21 07:03 lk77

As karma is now deprecated and coming up on EOL, we are no longer planning on any significant enhancements to this project and are instead going to focus on security updates, stability, and a migration path forward as karma's lifecycle comes to an end.

Thank you for supporting and using this project!

Oct 22 '23 01:10 codymikol

karma-webpack karma-webpack copied to clipboard

Issue with entry names being hashed

Feature Proposal

Feature Use Case

karma-webpack
karma-webpack copied to clipboard