How to use cssesc - 7 common examples

smartQuoteMark (options) {
        let v = this.value;
        let numSingleQuotes = v.replace(/[^']/g, '').length;
        let numDoubleQuotes = v.replace(/[^"]/g, '').length;
        if (numSingleQuotes + numDoubleQuotes === 0) {
            let escaped = cssesc(v, {isIdentifier: true});
            if (escaped === v) {
                return Attribute.NO_QUOTE;
            } else {
                let pref = this.preferredQuoteMark(options);
                if (pref === Attribute.NO_QUOTE) {
                    // pick a quote mark that isn't none and see if it's smaller
                    let quote = this.quoteMark || options.quoteMark || Attribute.DOUBLE_QUOTE;
                    let opts = CSSESC_QUOTE_OPTIONS[quote];
                    let quoteValue = cssesc(v, opts);
                    if (quoteValue.length < escaped.length) {
                        return quote;
                    }
                }
                return pref;
            }
        } else if (numDoubleQuotes === numSingleQuotes) {

smartQuoteMark (options) {
        let v = this.value;
        let numSingleQuotes = v.replace(/[^']/g, '').length;
        let numDoubleQuotes = v.replace(/[^"]/g, '').length;
        if (numSingleQuotes + numDoubleQuotes === 0) {
            let escaped = cssesc(v, {isIdentifier: true});
            if (escaped === v) {
                return Attribute.NO_QUOTE;
            } else {
                let pref = this.preferredQuoteMark(options);
                if (pref === Attribute.NO_QUOTE) {
                    // pick a quote mark that isn't none and see if it's smaller
                    let quote = this.quoteMark || options.quoteMark || Attribute.DOUBLE_QUOTE;
                    let opts = CSSESC_QUOTE_OPTIONS[quote];
                    let quoteValue = cssesc(v, opts);
                    if (quoteValue.length < escaped.length) {
                        return quote;
                    }
                }
                return pref;
            }
        } else if (numDoubleQuotes === numSingleQuotes) {
            return this.preferredQuoteMark(options);
        } else if ( numDoubleQuotes < numSingleQuotes) {
            return Attribute.DOUBLE_QUOTE;
        } else {
            return Attribute.SINGLE_QUOTE;
        }
    }

_syncRawValue () {
        let rawValue = cssesc(this._value, CSSESC_QUOTE_OPTIONS[this.quoteMark]);
        if (rawValue === this._value) {
            if (this.raws) {
                delete this.raws.value;
            }
        } else {
            this.raws.value = rawValue;
        }
    }

_handleEscapes (prop, value) {
        if (this._constructed) {
            let escaped = cssesc(value, {isIdentifier: true});
            if (escaped !== value) {
                this.raws[prop] = escaped;
            } else {
                delete this.raws[prop];
            }
        }
    }

let result = nodeName;
		if (
			isTargetNode &&
			nodeName.toLowerCase() === 'input' &&
			elm.getAttribute('type') &&
			(!id || nodesMap.shouldIgnore(id)) &&
			!elm.getAttribute('class')
		) {
			result += '[type=' + cssesc(elm.getAttribute('type')) + ']';
		}
		if (needsNthChild) {
			result += ':nth-child(' + (ownIndex + 1) + ')';
		} else if (needsClassNames) {
			for (const prefixedName of prefixedOwnClassNamesArray) {
				result += '.' + cssesc(prefixedName.slice(1));
			}
		}

		return new StepPath(result, false);
	}
	private createCssPathFromNode(node: MyNode, nodesMap: NodesMap): string {

template.items = cssItems.map( (item) => {
    item.image = item.image.replace(/\\/g, '\/');
    item.escaped_image = item.escaped_image.replace(/\\/g, '\/');
    item.name = formatWords([clsNamePrefix, item.name], options.connector);
    item['class'] = '.' + cssesc(item.name, {isIdentifier: true});
    if (wEnlarge) {
      const insertIndex = item.escaped_image.lastIndexOf('.');

      if (options.reqBase64) {
        spriteImgData.forEach( (item) => {
          if (item.imgName.toLowerCase() === tImgNameEnlarged.toLowerCase()) {
            enlargedImgData = item.base64;
          }
        })
      }

      if (!options.reqBase64 && insertIndex > 0) {
        enlargedImgData = `${item.escaped_image.slice(0, insertIndex)}@${wEnlarge}x${item.escaped_image.slice(insertIndex)}`;
      }

      item['enlargedImage'] = enlargedImgData;

const escapeIdentifier = identifier => escapeBackslashes(cssEscape(identifier, {
  isIdentifier: true
}))