POI 10, tests and coverage

The problem

You're using POI 10 with @poi/plugin-karma and want to get coverage of your unit tests. The way to do it is to specify:

  plugins: [
    require('@poi/plugin-karma')({
      coverage: true,
    })
  ]

and theoretically you should be all set. Only that it won't work:

TypeError: Cannot read property 'preLoaders' of undefined

I've looked everywhere and it seems that it is, unfortunately, not a known problem. What is even worse the GitHub repo with POI sources, version 10, is GONE! I mean I understand everything but removing history of an opensource project - that is a bit too much for me. SHAME ON YOU, EGOIST!

The solution

The problem is that @poi/plugin-karma taps directly to options of the vue-loader whist seems to be undefined at that point. The quick and dirty solution is to add those options:

  plugins: [
    require('@poi/plugin-karma')({
      coverage: true,
      chainWebpack (config) {
        config.module.rule('vue').use('vue-loader').options({})
      }
    })
  ]

I need to dig more into the matter why vue-loader isn't configured there and why the hell when testing a Vue.js SFC still causes errors but for now for testing just javascript code the above solution works

Happy coding

Replacing strings in proxied response using Apache mod_substitute

This is another quicky but it took me forever to finally figure it out - maybe someone will have that same problem...

The problem

You're working on a site that uses Apache2 proxy to merge your local frontend development environment with a remote site providing the content. That is easy to setup:

ProxyRequests Off
ProxyPreserveHost Off

ProxyPass "/path-to-a-resource" "http://localhost:3000/path-to-local-resource"
ProxyPass / http://remote-host/
ProxyPassReverse / http://remote-host/

Now all is nice and dandy until all you want to do is just to merge the remote site with local resources on localhost. It starts to get interesting when you want to modify the content sent by upstream server. Why? Well... let's say links in that sent HTML are absolute and you'd like them to be relative. There's a ton of options that are available once you can do that!

The solution

To be able to substitute strings in the response sent by upstream server there are 3 things that need to happen:

• Enable the mod_substitute ($ sudo a2enmod substitute)
• Enable filtering using mod_substitute
• Specify replacement rules

The second part is what gave me a headache Today. Basically you need to understand 2 things: when Apache does the substitution it needs to have the full page received to be able to perform the substitution. That doesn't happen automatically. And then once the substitution is done Apache needs to put it all back together and send it to the browser. It's all done using the following for HMTL files only:

AddOutputFilterByType INFLATE;SUBSTITUTE;DEFLATE text/html

And last but not least: we need some substitutions to see the effect. For the purpose of demonstration we'll replace all class attributes with TEST:

Substitute "s|class|TEST|i"

That's it! It's easy as pie when you know the deal :) I know I'll be using it more and more in the future!

Happy coding!