Add support for byte-range requests

[joemaller]

Eleventy Dev Server does not currently support byte-range requests, which causes locally served video files to fail on Safari and all iOS browsers.

This PR adds support for byte-range requests, so local video files load correctly from partial byte-range requests. This fixes #51.

Rather than trying to implement a new byte-range handler, I suggest the using the send library from PillarJS. This project already relies on their finalhandler library. These two libraries each log about 25M downloads per week.

I recognize, respect and appreciate the desire to keep 11ty's installations small. Send has 13 dependencies, 7 of which are already utilized and installed by eleventy-dev-server.

With send, byte-range requests can be implemented by simply adding a range-header check to eleventyProjectMiddleware:

if (req.headers.range) {
  return send(req, match.filepath).pipe(res);
}

Tests

The fetchHeadersForRequest test helper function was slightly modified. It now accepts an extras argument, which can be used to add additional http.request options. This allows the new tests to include a range header. The function's "Invalid status code" error-check was also modified to recognize success codes 200 and 206.

Changes to the tests were checked and verified before adding range-requests to server.js, all tests passed.

Two tests specific to this change were added. The first validates byte-range headers are returned correctly, the second assures byte-range headers do not appear on normal requests.

Also note that options.portReassignmentRetryCount was increased to prevent the test suite from running out of ports.

[noelforte]

@joemaller THANK YOU. I set an override in my package.json to use your version for now and it works beautifully. Just ran across this while doing some local development on my site and could not figure out why I couldn't see my <video>s on my phone...dang it Safari. 😂 Glad to know I wasn't the only one!

Adding my support for this pull (which is about 9 months old at this point). @zachleat (or maintainers), is there any way we could get this merged to mitigate this pain point?

[zachleat]

Shipping with 2.0.0 thank you!

[jmuspratt]

@joemaller THANK YOU. I set an override in my package.json to use your version for now and it works beautifully. Just ran across this while doing some local development on my site and could not figure out why I couldn't see my <video>s on my phone...dang it Safari. 😂 Glad to know I wasn't the only one!

Adding my support for this pull (which is about 9 months old at this point). @zachleat (or maintainers), is there any way we could get this merged to mitigate this pain point?

@noelforte Do you mind posting the relevant part of your package.json? My project is on eleventy 2.0.1 and I can't get seem to solve this either with an override or a dev dependency (@11ty/eleventy-dev-server": "^2.0.0",) to work. (The dev dependency seems to successfully install the 2.0.0 in my node_modules but doesn't get the videos playing in Safari). Thanks!

[noelforte]

@jmuspratt Remember to refresh your lockfile when editing overrides! This was oversight I ran into myself, so I'm betting that's why it's not working on your end.

I put together a reduced case over at https://github.com/noelforte/11ty-range-rtc to confirm that using eleventy-dev-server@^2.0.0 is possible with older versions of Eleventy. Hope this helps!

[jmuspratt]

@noelforte You are a gentleman and a scholar. That worked! And the demo helped narrow the actual issue: yarn does not support overrides 🤦 . (The equivalent in yarn is resolutions). Switching to npm and sticking with overrides worked for me.