COLR/CPAL color glyph rendering

[Connum]

Description

1. Implements calculation and drawing of color glyph layers in fonts using the COLRv0/CPALv0 format.

• Collects and calculates the path data for all the layers in a color glyph when calculating the path for drawing
• Provides higher-level methods instead of having to modify the table data manually, by providing a LayerManager object in Font.layers and a PaletteManager in Font.palettes

2. Includes some performance optimizations needed due to the complexity added by supporting layers

• Providing methods for binary search and binary insertion in util.js
• Not calling path.close() if a path is rendered without a stroke, as filling a path will automatically close the path anyway, resulting in an unnecessary calculation. path.close() was a big factor for long computation times when analyzing performance using the browser dev tools.
  Note: The more complex the supported features become (color glyphs, in the future hopefully font variation support), the worse the drawing performance gets. We will definitely have to implement some optimizations like caching in the future, or maybe even going full-async, in order to reduce computations and therefore increasing performance.

3. Adds some testing functionality by providing utility functions in testutil.js

• createMockObject(): creates a mock object for any browser element or API that we couldn't test in node otherwise (e.g. canvas contexts). The logs array includes all the calls and property accesses on the object, then it can be tested if the methods and parameters match expected operations.
• enableMockCanvas() enables testing canvas functionality that would normally only work in browser context (creating a mock canvas element, CSS color name conversion)

4. Extends the Glyph Inspector to test and showcase the new functionality:

• Font data will be kept in session storage, so that reloading the page (e.g. automatically via HMR) will preserve the last loaded font. This made development and testing way faste for me.
• Made several CSS & JS bugfixes
• Show the palettes available in the font
• Allow changing the used palette with immediate effect
• Very basic palette modification: adding/deleting palettes, adding new color fields, changing colors
• Display layer information and their glyphs

5. Made some updates to the README while I was adding the new APIs

Motivation and Context

#490 added parsing and writing support for both tables, but actually getting the paths and colors for a color glyph and drawing it was not implemented. Manipulating the layers and palettes is quite complex, and developers using opentype.js would all have had to implement similar functionality in order to make use of the data. With this PR it works out-of-the-box.

How Has This Been Tested?

I added fairly extensive tests that should cover everything.

Screenshots (if appropriate):

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

• I did npm run test and all tests passed green (including code styling checks).
• I have added tests to cover my changes.
• My change requires a change to the documentation.
• I have updated the README accordingly.
• I have read the CONTRIBUTING document.