fauxJax request event not firing

tommedema commented 6 years ago

I'm trying to fix a bug where paths to resources specified in css files are resolved incorrectly when they are absolute root paths, such as /image.png instead of image.png or ./image.png.

Currently there is a bug in this scenario:

basePath (relativeTo) is http://www.example.com/
example.com/index.html has a stylesheet link at assets/main.css: <link href="assets/css-root-path.css" rel="stylesheet">
assets/main.css has a background image with url(/image.png) (notice the prefix of /)

The background image is now resolved to http://www.example.com/assets/image.png whereas obviously it should resolve to the root domain i.e. http://www.example.com/image.png due to the preceding /.

I'm trying to make a PR to fix this, but am experiencing unexpected behavior when mocking http requests with fauxJax. I created the following test:

describe( "(http mocking)", function()
    {
        var baseUrl = "http://example.com/";

        beforeEach( function()
        {
            fauxJax.install();
            fauxJax.on( "request", function( request )
            {
                console.log('faux request %j', request)
                assert.equal( request.requestURL.indexOf( baseUrl ), 0 );
                var relativePath = request.requestURL.slice( baseUrl.length ).replace( /\?.*/, "" );
                var headers = {
                    "Content-Type": mime.contentType( path.extname( relativePath ) ) || "application/octet-stream"
                };
                console.log(relativePath)
                var content = fs.readFileSync( "test/cases/" + relativePath );
                request.respond( 200, headers, content );
            } );
        } );

        afterEach( function()
        {
            fauxJax.restore();
        } );

        it.only( "should respect absolute root paths inside css files ", function( done )
        {
            inline.html( {
                fileContent: readFile( "test/cases/css-root-path.html" ),
                relativeTo: baseUrl,
                links: true,
                requestTransform: function( options )
                {
                    console.log('request transform');
                    console.log(options);
                }
            }, function( err, result )
            {
                console.log('err %j', err)
                console.log('result %j', result)
            } );
        } );
} );

requestTransform is fired with an expected uri of http://example.com/assets/css-root-path.css. This is normal.

What is not normal is that fauxJax.on("request" is never fired. I.e. there is no log line from console.log('faux request %j', request)

The complete output is:

> web-resource-inliner@4.2.0 test /Users/tommedema/Drive/projects/forks/web-resource-inliner
> mocha test

  html
    (http mocking)
request transform
{ uri: 'http://example.com/assets/css-root-path.css',
  encoding: undefined,
  gzip: true }
Not found, skipping: assets/css-root-path.css
err null
result "<!DOCTYPE html>\n<html>\n<head>\n    <title>test css file using root path</title>\n    <link href=\"assets/css-root-path.css\" rel=\"stylesheet\">\n</head>\n<body>\n</body>\n</html>\n"
      1) should respect absolute root paths inside css files

@jrit Do you understand why fauxJax.on( "request", ... is not firing? I need to dig into this method to see why assets/css-root-path.css is not found (404), even though it is in the specified folder and should be mocked by fauxJax.

tommedema commented 6 years ago

It's weird how it can say Not found, skipping: assets/css-root-path.css when fauxJax.on( "request", ...) is never even fired.

What's also weird is that when I specify strict: true, the callback is called without an error argument.

Note that I'm working from the latest master branch (i.e. no other local changes other than the test file).

tommedema commented 6 years ago

Got it

requestTransform: function( options )
                {
                    console.log('request transform');
                    console.log(options);
                }

Should be

requestTransform: function( options )
                {
                    console.log('request transform');
                    console.log(options);
                    return options;
                }

the not found error is not descriptive, but there are bigger fish to catch

jrit / web-resource-inliner

fauxJax request event not firing #36