Skip to content

Having a non-breaking space in css leads to error #1006

Closed
@blackholegalaxy

Description

@blackholegalaxy

Environment

Using clean-css through Angular CLI 1.7.0 which moved to clean-css. clean-css is imported through webpack plugin as it can seen here: https://github.com/angular/angular-cli/blob/master/packages/@angular/cli/plugins/cleancss-webpack-plugin.ts

Configuration options

 const cleancss = new CleanCSS({
          compatibility: 'ie9',
          level: 2,
          inline: false,
          returnPromise: true,
          sourceMap: this._options.sourceMap,
        });

Input SCSS

Image, since non-breaking space would not show up properly (screenshot taken on VSCode on faulty scss code, with Highlight bad characters VSCode plugin):

bad_char

This code was transpiled to CSS, which still contains the non-breaking space. Resulting in following error.

Error

/project/node_modules/clean-css/lib/reader/input-source-map-tracker.js:37
if (originalPosition.line === null && line > 1 && selectorFallbacks > 0) {

TypeError: Cannot read property 'line' of undefined
at originalPositionFor (/project/node_modules/clean-css/lib/reader/input-source-map-tracker.js:37:24)
at originalMetadata (/project/node_modules/clean-css/lib/tokenizer/tokenize.js:486:43)
at intoTokens (/project/node_modules/clean-css/lib/tokenizer/tokenize.js:435:68)
at tokenize (/project/node_modules/clean-css/lib/tokenizer/tokenize.js:74:10)
at fromStyles (/project/node_modules/clean-css/lib/reader/read-sources.js:147:12)
at fromString (/project/node_modules/clean-css/lib/reader/read-sources.js:48:10)
at doReadSources (/project/node_modules/clean-css/lib/reader/read-sources.js:33:12)
at readSources (/project/node_modules/clean-css/lib/reader/read-sources.js:24:10)
at /project/node_modules/clean-css/lib/clean.js:99:12
at _combinedTickCallback (internal/process/next_tick.js:131:7)
at process._tickCallback (internal/process/next_tick.js:180:9)

Expected behavior

Presence of non-breaking space should not block the production of css since these kind of spaces should be deleted in the minification process.

Potential fix

We could add a marker for no-break space and replace the character with standard space.

NO_BREAK_SPACE: /\u00A0|\u202F|\uFEFF/g,

then in tokenize:

isNoBreakSpace = Marker.NO_BREAK_SPACE.test(character);
...
else if (isNoBreakSpace) {
      // Replace any kind of no-break-space with standard space
      character = Marker.SPACE;
      buffer.push(character);
    }

Can't open a PR as I don't know how to test that in your test suit.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions