Unlock 30% off on Manual Testing Annual Plans this Holiday Season.

Copied to Clipboard!

How to use decodeHtmlBrowser method in Playwright Internal

Best JavaScript code snippet using playwright-internal

compiler-dom.global.js

Source:compiler-dom.global.js

...6758      0x9f: 0x01786759  };6760  /* eslint-disable no-restricted-globals */6761  let decoder;6762  function decodeHtmlBrowser(raw) {6763      (decoder || (decoder = document.createElement('div'))).innerHTML = raw;6764      return decoder.textContent;6765  }6766  const isRawTextContainer = /*#__PURE__*/ makeMap('style,iframe,script,noscript', true);6767  const parserOptions = {6768      isVoidTag,6769      isNativeTag: tag => isHTMLTag(tag) || isSVGTag(tag),6770      isPreTag: tag => tag === 'pre',6771      decodeEntities:  decodeHtmlBrowser ,6772      isBuiltInComponent: (tag) => {6773          if (isBuiltInType(tag, `Transition`)) {6774              return TRANSITION;6775          }6776          else if (isBuiltInType(tag, `TransitionGroup`)) {
...

vue.global.js

Source:vue.global.js

...4792    )4793  }4794  /* eslint-disable no-restricted-globals */4795  let decoder4796  function decodeHtmlBrowser(raw) {4797    ;(decoder || (decoder = document.createElement('div'))).innerHTML = raw4798    return decoder.textContent4799  }4800  const isRawTextContainer = /*#__PURE__*/ makeMap(4801    'style,iframe,script,noscript',4802    true4803  )4804  const parserOptions = {4805    isVoidTag,4806    isNativeTag: tag => isHTMLTag(tag) || isSVGTag(tag),4807    isPreTag: tag => tag === 'pre',4808    decodeEntities: decodeHtmlBrowser,4809    isBuiltInComponent: tag => {4810      if (isBuiltInType(tag, `Transition`)) {...

compiler-dom.esm-browser.js

Source:compiler-dom.esm-browser.js

...3625    [TRANSITION]: `Transition`,3626    [TRANSITION_GROUP]: `TransitionGroup`3627});3628let decoder;3629function decodeHtmlBrowser(raw) {3630    (decoder || (decoder = document.createElement('div'))).innerHTML = raw;3631    return decoder.textContent;3632}3633const isRawTextContainer = /*#__PURE__*/ makeMap('style,iframe,script,noscript', true);3634const parserOptions = {3635    isVoidTag,3636    isNativeTag: tag => isHTMLTag(tag) || isSVGTag(tag),3637    isPreTag: tag => tag === 'pre',3638    decodeEntities:  decodeHtmlBrowser ,3639    isBuiltInComponent: (tag) => {3640        if (isBuiltInType(tag, `Transition`)) {3641            return TRANSITION;3642        }3643        else if (isBuiltInType(tag, `TransitionGroup`)) {
...

note-compile.js

Source:note-compile.js

1const parserOptions = {2    isVoidTag,3    isNativeTag: tag => isHTMLTag(tag) || isSVGTag(tag),4    isPreTag: tag => tag === 'pre',5    decodeEntities:  decodeHtmlBrowser,6    isBuiltInComponent: (tag) => {7        if (isBuiltInType(tag, `Transition`)) {8            return TRANSITION$1;9        }10        else if (isBuiltInType(tag, `TransitionGroup`)) {11            return TRANSITION_GROUP;12        }13    },14    // https://html.spec.whatwg.org/multipage/parsing.html#tree-construction-dispatcher15    getNamespace(tag, parent) {16        let ns = parent ? parent.ns : 0 /* HTML */;17        if (parent && ns === 2 /* MATH_ML */) {18            if (parent.tag === 'annotation-xml') {19                if (tag === 'svg') {20                    return 1 /* SVG */;21                }22                if (parent.props.some(a => a.type === 6 /* ATTRIBUTE */ &&23                    a.name === 'encoding' &&24                    a.value != null &&25                    (a.value.content === 'text/html' ||26                        a.value.content === 'application/xhtml+xml'))) {27                    ns = 0 /* HTML */;28                }29            }30            else if (/^m(?:[ions]|text)$/.test(parent.tag) &&31                tag !== 'mglyph' &&32                tag !== 'malignmark') {33                ns = 0 /* HTML */;34            }35        }36        else if (parent && ns === 1 /* SVG */) {37            if (parent.tag === 'foreignObject' ||38                parent.tag === 'desc' ||39                parent.tag === 'title') {40                ns = 0 /* HTML */;41            }42        }43        if (ns === 0 /* HTML */) {44            if (tag === 'svg') {45                return 1 /* SVG */;46            }47            if (tag === 'math') {48                return 2 /* MATH_ML */;49            }50        }51        return ns;52    },53    // https://html.spec.whatwg.org/multipage/parsing.html#parsing-html-fragments54    getTextMode({ tag, ns }) {55        if (ns === 0 /* HTML */) {56            if (tag === 'textarea' || tag === 'title') {57                return 1 /* RCDATA */;58            }59            if (isRawTextContainer(tag)) {60                return 2 /* RAWTEXT */;61            }62        }63        return 0 /* DATA */;64    }65};66const DOMNodeTransforms = [67    transformStyle,68    ...( [warnTransitionChildren] )69];70let compile71registerRuntimeCompiler(compileToFunction);72function registerRuntimeCompiler(_compile) {73    compile = _compile;74}75function compileToFunction(template, options) {76    if (!isString(template)) {77        if (template.nodeType) {78            template = template.innerHTML;79        }80        else {81             warn(`invalid template option: `, template);82            return NOOP;83        }84    }85    const key = template;86    const cached = compileCache[key];87    if (cached) {88        return cached;89    }90    if (template[0] === '#') {91        const el = document.querySelector(template);92        if ( !el) {93            warn(`Template element not found or is empty: ${template}`);94        }95        // __UNSAFE__96        // Reason: potential execution of JS expressions in in-DOM template.97        // The user must make sure the in-DOM template is trusted. If it's rendered98        // by the server, the template should not contain any user data.99        template = el ? el.innerHTML : ``;100    }101    const { code } = compile$1(template, extend({102        hoistStatic: true,103        onError(err) {104            {105                const message = `Template compilation error: ${err.message}`;106                const codeFrame = err.loc &&107                    generateCodeFrame(template, err.loc.start.offset, err.loc.end.offset);108                warn(codeFrame ? `${message}\n${codeFrame}` : message);109            }110        }111    }, options));112    // The wildcard import results in a huge object with every export113    // with keys that cannot be mangled, and can be quite heavy size-wise.114    // In the global build we know `Vue` is available globally so we can avoid115    // the wildcard object.116    const render = ( new Function('Vue', code)(runtimeDom));117    render._rc = true;118    return (compileCache[key] = render);119}120function finishComponentSetup(instance, isSSR) {121    const Component = instance.type;122    // template / render function normalization123    if (!instance.render) {124        // could be set from setup()125        if (compile && Component.template && !Component.render) {126            {127                startMeasure(instance, `compile`);128            }129            Component.render = compile(Component.template, {130                isCustomElement: instance.appContext.config.isCustomElement,131                delimiters: Component.delimiters132            });133            {134                endMeasure(instance, `compile`);135            }136        }137        instance.render = (Component.render || NOOP);138        // for runtime-compiled render functions using `with` blocks, the render139        // proxy used needs a different `has` handler which is more performant and140        // also only allows a whitelist of globals to fallthrough.141        if (instance.render._rc) {142            instance.withProxy = new Proxy(instance.ctx, RuntimeCompiledPublicInstanceProxyHandlers);143        }144    }145    // support for 2.x options146    {147        currentInstance = instance;148        applyOptions(instance, Component);149        currentInstance = null;150    }151    // warn missing template/render152    if ( !Component.render && instance.render === NOOP) {153        /* istanbul ignore if */154        if (!compile && Component.template) {155            warn(`Component provided template option but ` +156                `runtime compilation is not supported in this build of Vue.` +157                (  ` Use "vue.esm-browser.js" instead.`158                        ) /* should not happen */);159        }160        else {161            warn(`Component is missing template or render function.`);162        }163    }164}165function compile$1(template, options = {}) {166    return baseCompile(template, extend({}, parserOptions, options, {167        nodeTransforms: [168            // ignore <script> and <tag>169            // this is not put inside DOMNodeTransforms because that list is used170            // by compiler-ssr to generate vnode fallback branches171            ignoreSideEffectTags,172            ...DOMNodeTransforms,173            ...(options.nodeTransforms || [])174        ],175        directiveTransforms: extend({}, DOMDirectiveTransforms, options.directiveTransforms || {}),176        transformHoist:  null 177    }));178}179// we name it `baseCompile` so that higher order compilers like180// @vue/compiler-dom can export `compile` while re-exporting everything else.181function baseCompile(template, options = {}) {182    const onError = options.onError || defaultOnError;183    const isModuleMode = options.mode === 'module';184    /* istanbul ignore if */185    {186        if (options.prefixIdentifiers === true) {187            onError(createCompilerError(45 /* X_PREFIX_ID_NOT_SUPPORTED */));188        }189        else if (isModuleMode) {190            onError(createCompilerError(46 /* X_MODULE_MODE_NOT_SUPPORTED */));191        }192    }193    const prefixIdentifiers = !true ;194    if ( options.cacheHandlers) {195        onError(createCompilerError(47 /* X_CACHE_HANDLER_NOT_SUPPORTED */));196    }197    if (options.scopeId && !isModuleMode) {198        onError(createCompilerError(48 /* X_SCOPE_ID_NOT_SUPPORTED */));199    }200    const ast = isString(template) ? baseParse(template, options) : template;201    const [nodeTransforms, directiveTransforms] = getBaseTransformPreset();202    transform(ast, extend({}, options, {203        prefixIdentifiers,204        nodeTransforms: [205            ...nodeTransforms,206            ...(options.nodeTransforms || []) // user transforms207        ],208        directiveTransforms: extend({}, directiveTransforms, options.directiveTransforms || {} // user transforms209        )210    }));211    return generate(ast, extend({}, options, {212        prefixIdentifiers213    }));214}215function defaultOnError(error) {216    throw error;217}218// baseParse template -> ast219function baseParse(content, options = {}) {220    const context = createParserContext(content, options);221    const start = getCursor(context);222    return createRoot(parseChildren(context, 0 /* DATA */, []), getSelection(context, start));223}224function createParserContext(content, rawOptions) {225    const options = extend({}, defaultParserOptions);226    for (const key in rawOptions) {227        // @ts-ignore228        options[key] = rawOptions[key] || defaultParserOptions[key];229    }230    return {231        options,232        column: 1,233        line: 1,234        offset: 0,235        originalSource: content,236        source: content,237        inPre: false,238        inVPre: false239    };240}241function getCursor(context) {242    const { column, line, offset } = context;243    return { column, line, offset };244}245function createRoot(children, loc = locStub) {246    return {247        type: 0 /* ROOT */,248        children,249        helpers: [],250        components: [],251        directives: [],252        hoists: [],253        imports: [],254        cached: 0,255        temps: 0,256        codegenNode: undefined,257        loc258    };259}260// createRoot(parseChildren(context, 0, []), getSelection(context, start));261const defaultParserOptions = {262    delimiters: [`{{`, `}}`],263    getNamespace: () => 0 /* HTML */,264    getTextMode: () => 0 /* DATA */,265    isVoidTag: NO,266    isPreTag: NO,267    isCustomElement: NO,268    decodeEntities: (rawText) => rawText.replace(decodeRE, (_, p1) => decodeMap[p1]),269    onError: defaultOnError,270    comments: false271};272/**273 * namespace274 * 0: html275 * 1: svg276 * 2: MATH_ML277 */278function getNamespace (tag, parent) {279    let ns = parent ? parent.ns : 0 /* HTML */;280    if (parent && ns === 2 /* MATH_ML */) {281        if (parent.tag === 'annotation-xml') {282            if (tag === 'svg') {283                return 1 /* SVG */;284            }285            if (parent.props.some(a => a.type === 6 /* ATTRIBUTE */ &&286                a.name === 'encoding' &&287                a.value != null &&288                (a.value.content === 'text/html' ||289                    a.value.content === 'application/xhtml+xml'))) {290                ns = 0 /* HTML */;291            }292        }293        else if (/^m(?:[ions]|text)$/.test(parent.tag) &&294            tag !== 'mglyph' &&295            tag !== 'malignmark') {296            ns = 0 /* HTML */;297        }298    }299    else if (parent && ns === 1 /* SVG */) {300        if (parent.tag === 'foreignObject' ||301            parent.tag === 'desc' ||302            parent.tag === 'title') {303            ns = 0 /* HTML */;304        }305    }306    if (ns === 0 /* HTML */) {307        if (tag === 'svg') {308            return 1 /* SVG */;309        }310        if (tag === 'math') {311            return 2 /* MATH_ML */;312        }313    }314    return ns;315}316function parseChildren(context, mode, ancestors) {317    const parent = last(ancestors);318    const ns = parent ? parent.ns : 0 /* HTML */;319    const nodes = [];320    while (!isEnd(context, mode, ancestors)) {321        const s = context.source;322        let node = undefined;323        if (mode === 0 /* DATA */ || mode === 1 /* RCDATA */) {324            if (!context.inVPre && startsWith(s, context.options.delimiters[0])) {325                // '{{'326                node = parseInterpolation(context, mode);327            }328            else if (mode === 0 /* DATA */ && s[0] === '<') {329                // https://html.spec.whatwg.org/multipage/parsing.html#tag-open-state330                if (s.length === 1) {331                    emitError(context, 5 /* EOF_BEFORE_TAG_NAME */, 1);332                }333                else if (s[1] === '!') {334                    // https://html.spec.whatwg.org/multipage/parsing.html#markup-declaration-open-state335                    if (startsWith(s, '<!--')) {336                        node = parseComment(context);337                    }338                    else if (startsWith(s, '<!DOCTYPE')) {339                        // Ignore DOCTYPE by a limitation.340                        node = parseBogusComment(context);341                    }342                    else if (startsWith(s, '<![CDATA[')) {343                        if (ns !== 0 /* HTML */) {344                            node = parseCDATA(context, ancestors);345                        }346                        else {347                            emitError(context, 1 /* CDATA_IN_HTML_CONTENT */);348                            node = parseBogusComment(context);349                        }350                    }351                    else {352                        emitError(context, 11 /* INCORRECTLY_OPENED_COMMENT */);353                        node = parseBogusComment(context);354                    }355                }356                else if (s[1] === '/') {357                    // https://html.spec.whatwg.org/multipage/parsing.html#end-tag-open-state358                    if (s.length === 2) {359                        emitError(context, 5 /* EOF_BEFORE_TAG_NAME */, 2);360                    }361                    else if (s[2] === '>') {362                        emitError(context, 14 /* MISSING_END_TAG_NAME */, 2);363                        advanceBy(context, 3);364                        continue;365                    }366                    else if (/[a-z]/i.test(s[2])) {367                        emitError(context, 23 /* X_INVALID_END_TAG */);368                        parseTag(context, 1 /* End */, parent);369                        continue;370                    }371                    else {372                        emitError(context, 12 /* INVALID_FIRST_CHARACTER_OF_TAG_NAME */, 2);373                        node = parseBogusComment(context);374                    }375                }376                else if (/[a-z]/i.test(s[1])) {377                    node = parseElement(context, ancestors);378                }379                else if (s[1] === '?') {380                    emitError(context, 21 /* UNEXPECTED_QUESTION_MARK_INSTEAD_OF_TAG_NAME */, 1);381                    node = parseBogusComment(context);382                }383                else {384                    emitError(context, 12 /* INVALID_FIRST_CHARACTER_OF_TAG_NAME */, 1);385                }386            }387        }388        if (!node) {389            node = parseText(context, mode);390        }391        if (isArray(node)) {392            for (let i = 0; i < node.length; i++) {393                pushNode(nodes, node[i]);394            }395        }396        else {397            pushNode(nodes, node);398        }399    }400    // Whitespace management for more efficient output401    // (same as v2 whitespace: 'condense')402    let removedWhitespace = false;403    if (mode !== 2 /* RAWTEXT */) {404        if (!context.inPre) {405            for (let i = 0; i < nodes.length; i++) {406                const node = nodes[i];407                if (node.type === 2 /* TEXT */) {408                    if (!/[^\t\r\n\f ]/.test(node.content)) {409                        const prev = nodes[i - 1];410                        const next = nodes[i + 1];411                        // If:412                        // - the whitespace is the first or last node, or:413                        // - the whitespace is adjacent to a comment, or:414                        // - the whitespace is between two elements AND contains newline415                        // Then the whitespace is ignored.416                        if (!prev ||417                            !next ||418                            prev.type === 3 /* COMMENT */ ||419                            next.type === 3 /* COMMENT */ ||420                            (prev.type === 1 /* ELEMENT */ &&421                                next.type === 1 /* ELEMENT */ &&422                                /[\r\n]/.test(node.content))) {423                            removedWhitespace = true;424                            nodes[i] = null;425                        }426                        else {427                            // Otherwise, condensed consecutive whitespace inside the text428                            // down to a single space429                            node.content = ' ';430                        }431                    }432                    else {433                        node.content = node.content.replace(/[\t\r\n\f ]+/g, ' ');434                    }435                }436            }437        }438        else if (parent && context.options.isPreTag(parent.tag)) {439            // remove leading newline per html spec440            // https://html.spec.whatwg.org/multipage/grouping-content.html#the-pre-element441            const first = nodes[0];442            if (first && first.type === 2 /* TEXT */) {443                first.content = first.content.replace(/^\r?\n/, '');444            }445        }446    }447    return removedWhitespace ? nodes.filter(Boolean) : nodes;448}449function getCursor(context) {450    const { column, line, offset } = context;451    return { column, line, offset };452}453function getSelection(context, start, end) {454    end = end || getCursor(context);455    return {456        start,457        end,458        source: context.originalSource.slice(start.offset, end.offset)459    };460}461function advanceBy(context, numberOfCharacters) {462    const { source } = context;463    advancePositionWithMutation(context, source, numberOfCharacters);464    context.source = source.slice(numberOfCharacters);465}466// advance by mutation without cloning (for performance reasons), since this467// gets called a lot in the parser468function advancePositionWithMutation(pos, source, numberOfCharacters = source.length) {469    let linesCount = 0;470    let lastNewLinePos = -1;471    for (let i = 0; i < numberOfCharacters; i++) {472        if (source.charCodeAt(i) === 10 /* newline char code */) {473            linesCount++;474            lastNewLinePos = i;475        }476    }477    pos.offset += numberOfCharacters;478    pos.line += linesCount;479    pos.column =480        lastNewLinePos === -1481            ? pos.column + numberOfCharacters482            : numberOfCharacters - lastNewLinePos;483    return pos;484}485/**486 * ROOT 487 * type: 0488 * {489        type: 0,490        children,491        helpers: [],492        components: [],493        directives: [],494        hoists: [],495        imports: [],496        cached: 0,497        temps: 0,498        codegenNode: undefined,499        loc500    };501 */502/**503 * TEXT 504 * type: 2505 */506function parseText(context, mode) {507    const endTokens = ['<', context.options.delimiters[0]];508    if (mode === 3 /* CDATA */) {509        endTokens.push(']]>');510    }511    let endIndex = context.source.length;512    for (let i = 0; i < endTokens.length; i++) {513        const index = context.source.indexOf(endTokens[i], 1);514        if (index !== -1 && endIndex > index) {515            endIndex = index;516        }517    }518    const start = getCursor(context);519    const content = parseTextData(context, endIndex, mode);520    return {521        type: 2 /* TEXT */,522        content,523        loc: getSelection(context, start)524    };525}526function parseTextData(context, length, mode) {527    const rawText = context.source.slice(0, length);528    advanceBy(context, length);529    if (mode === 2 /* RAWTEXT */ ||530        mode === 3 /* CDATA */ ||531        rawText.indexOf('&') === -1) {532        return rawText;533    }534    else {535        // DATA or RCDATA containing "&"". Entity decoding required.536        return context.options.decodeEntities(rawText, mode === 4 /* ATTRIBUTE_VALUE */);537    }538}539/**540 * INTERPOLATION {{...}}541 * type: 5542 */543function parseInterpolation(context, mode) {544    const [open, close] = context.options.delimiters;545    const closeIndex = context.source.indexOf(close, open.length);546    if (closeIndex === -1) {547        emitError(context, 25 /* X_MISSING_INTERPOLATION_END */);548        return undefined;549    }550    const start = getCursor(context);551    advanceBy(context, open.length);552    const innerStart = getCursor(context);553    const innerEnd = getCursor(context);554    const rawContentLength = closeIndex - open.length;555    const rawContent = context.source.slice(0, rawContentLength);556    const preTrimContent = parseTextData(context, rawContentLength, mode);557    const content = preTrimContent.trim();558    const startOffset = preTrimContent.indexOf(content);559    if (startOffset > 0) {560        advancePositionWithMutation(innerStart, rawContent, startOffset);561    }562    const endOffset = rawContentLength - (preTrimContent.length - content.length - startOffset);563    advancePositionWithMutation(innerEnd, rawContent, endOffset);564    advanceBy(context, close.length);565    return {566        type: 5 /* INTERPOLATION */,567        content: {568            type: 4 /* SIMPLE_EXPRESSION */,569            isStatic: false,570            // Set `isConstant` to false by default and will decide in transformExpression571            isConstant: false,572            content,573            loc: getSelection(context, innerStart, innerEnd)574        },575        loc: getSelection(context, start)576    };577}578/**579 * SIMPLE_EXPRESSION {{...}}580 * type: 4581 * {582        type: 4,583        content: value.content,584        isStatic: false,585        isConstant: false,586        loc: value.loc587    }588 */589/**590 * COMMENT <!DOCTYPE>, <!---->591 * type: 3592 */593function parseComment(context) {594    const start = getCursor(context);595    let content;596    // Regular comment.597    const match = /--(\!)?>/.exec(context.source);598    if (!match) {599        content = context.source.slice(4);600        advanceBy(context, context.source.length);601        emitError(context, 7 /* EOF_IN_COMMENT */);602    }603    else {604        if (match.index <= 3) {605            emitError(context, 0 /* ABRUPT_CLOSING_OF_EMPTY_COMMENT */);606        }607        if (match[1]) {608            emitError(context, 10 /* INCORRECTLY_CLOSED_COMMENT */);609        }610        content = context.source.slice(4, match.index);611        // Advancing with reporting nested comments.612        const s = context.source.slice(0, match.index);613        let prevIndex = 1, nestedIndex = 0;614        while ((nestedIndex = s.indexOf('<!--', prevIndex)) !== -1) {615            advanceBy(context, nestedIndex - prevIndex + 1);616            if (nestedIndex + 4 < s.length) {617                emitError(context, 16 /* NESTED_COMMENT */);618            }619            prevIndex = nestedIndex + 1;620        }621        advanceBy(context, match.index + match[0].length - prevIndex + 1);622    }623    return {624        type: 3 /* COMMENT */,625        content,626        loc: getSelection(context, start)627    };628}629function parseBogusComment(context) {630    const start = getCursor(context);631    const contentStart = context.source[1] === '?' ? 1 : 2;632    let content;633    const closeIndex = context.source.indexOf('>');634    if (closeIndex === -1) {635        content = context.source.slice(contentStart);636        advanceBy(context, context.source.length);637    }638    else {639        content = context.source.slice(contentStart, closeIndex);640        advanceBy(context, closeIndex + 1);641    }642    return {643        type: 3 /* COMMENT */,644        content,645        loc: getSelection(context, start)646    };647}648// CDATA æçæ¯ä¸ç± XML è§£æå¨è¿è¡è§£æçææ¬æ°æ®ã649function parseCDATA(context, ancestors) {650    advanceBy(context, 9);651    const nodes = parseChildren(context, 3 /* CDATA */, ancestors);652    if (context.source.length === 0) {653        emitError(context, 6 /* EOF_IN_CDATA */);654    }655    else {656        advanceBy(context, 3);657    }658    return nodes;659}660/**661 * ELEMENT662 * type: 1663 * {664        type: 1,665        ns,666        tag,667        tagType, 1: component 2:slot 3:template668        props,669        isSelfClosing,670        children: [],671        loc: getSelection(context, start),672        codegenNode: undefined673    }674 */675function parseElement(context, ancestors) {676    // Start tag.677    const wasInPre = context.inPre;678    const wasInVPre = context.inVPre;679    const parent = last(ancestors);680    const element = parseTag(context, 0 /* Start */, parent);681    const isPreBoundary = context.inPre && !wasInPre;682    const isVPreBoundary = context.inVPre && !wasInVPre;683    if (element.isSelfClosing || context.options.isVoidTag(element.tag)) {684        return element;685    }686    // Children.687    ancestors.push(element);688    const mode = context.options.getTextMode(element, parent);689    const children = parseChildren(context, mode, ancestors);690    ancestors.pop();691    element.children = children;692    // End tag.693    if (startsWithEndTagOpen(context.source, element.tag)) {694        parseTag(context, 1 /* End */, parent);695    }696    else {697        emitError(context, 24 /* X_MISSING_END_TAG */, 0, element.loc.start);698        if (context.source.length === 0 && element.tag.toLowerCase() === 'script') {699            const first = children[0];700            if (first && startsWith(first.loc.source, '<!--')) {701                emitError(context, 8 /* EOF_IN_SCRIPT_HTML_COMMENT_LIKE_TEXT */);702            }703        }704    }705    element.loc = getSelection(context, element.loc.start);706    if (isPreBoundary) {707        context.inPre = false;708    }709    if (isVPreBoundary) {710        context.inVPre = false;711    }712    return element;713}714function parseTag(context, type, parent) {715    // Tag open.716    const start = getCursor(context);717    const match = /^<\/?([a-z][^\t\r\n\f />]*)/i.exec(context.source);718    const tag = match[1];719    const ns = context.options.getNamespace(tag, parent);720    advanceBy(context, match[0].length);721    advanceSpaces(context);722    // save current state in case we need to re-parse attributes with v-pre723    const cursor = getCursor(context);724    const currentSource = context.source;725    // Attributes.726    let props = parseAttributes(context, type);727    // check <pre> tag728    if (context.options.isPreTag(tag)) {729        context.inPre = true;730    }731    // check v-pre732    if (!context.inVPre &&733        props.some(p => p.type === 7 /* DIRECTIVE */ && p.name === 'pre')) {734        context.inVPre = true;735        // reset context736        extend(context, cursor);737        context.source = currentSource;738        // re-parse attrs and filter out v-pre itself739        props = parseAttributes(context, type).filter(p => p.name !== 'v-pre');740    }741    // Tag close.742    let isSelfClosing = false;743    if (context.source.length === 0) {744        emitError(context, 9 /* EOF_IN_TAG */);745    }746    else {747        isSelfClosing = startsWith(context.source, '/>');748        if (type === 1 /* End */ && isSelfClosing) {749            emitError(context, 4 /* END_TAG_WITH_TRAILING_SOLIDUS */);750        }751        advanceBy(context, isSelfClosing ? 2 : 1);752    }753    let tagType = 0 /* ELEMENT */;754    const options = context.options;755    if (!context.inVPre && !options.isCustomElement(tag)) {756        const hasVIs = props.some(p => p.type === 7 /* DIRECTIVE */ && p.name === 'is');757        if (options.isNativeTag && !hasVIs) {758            if (!options.isNativeTag(tag))759                tagType = 1 /* COMPONENT */;760        }761        else if (hasVIs ||762            isCoreComponent(tag) ||763            (options.isBuiltInComponent && options.isBuiltInComponent(tag)) ||764            /^[A-Z]/.test(tag) ||765            tag === 'component') {766            tagType = 1 /* COMPONENT */;767        }768        if (tag === 'slot') {769            tagType = 2 /* SLOT */;770        }771        else if (tag === 'template' &&772            props.some(p => {773                return (p.type === 7 /* DIRECTIVE */ && isSpecialTemplateDirective(p.name));774            })) {775            tagType = 3 /* TEMPLATE */;776        }777    }778    return {779        type: 1 /* ELEMENT */,780        ns,781        tag,782        tagType,783        props,784        isSelfClosing,785        children: [],786        loc: getSelection(context, start),787        codegenNode: undefined // to be created during transform phase788    };789}790function parseAttributes(context, type) {791    const props = [];792    const attributeNames = new Set();793    while (context.source.length > 0 &&794        !startsWith(context.source, '>') &&795        !startsWith(context.source, '/>')) {796        if (startsWith(context.source, '/')) {797            emitError(context, 22 /* UNEXPECTED_SOLIDUS_IN_TAG */);798            advanceBy(context, 1);799            advanceSpaces(context);800            continue;801        }802        if (type === 1 /* End */) {803            emitError(context, 3 /* END_TAG_WITH_ATTRIBUTES */);804        }805        const attr = parseAttribute(context, attributeNames);806        if (type === 0 /* Start */) {807            props.push(attr);808        }809        if (/^[^\t\r\n\f />]/.test(context.source)) {810            emitError(context, 15 /* MISSING_WHITESPACE_BETWEEN_ATTRIBUTES */);811        }812        advanceSpaces(context);813    }814    return props;815}816/**817 * ATTRIBUTE818 * type: 6819 * {820        type: 6,821        name,822        value: value && {823            type: 2,824            content: value.content,825            loc: value.loc826        },827        loc828    };829 */830/**831 * DIRECTIVE832 * type: 7833 * {834        type: 7,835        name: dirName,836        exp: value && {837            type: 4,838            content: value.content,839            isStatic: false,840            isConstant: false,841            loc: value.loc842        },843        arg,844        modifiers: match[3] ? match[3].substr(1).split('.') : [],845        loc846    }847 */848function parseAttribute(context, nameSet) {849    // Name.850    const start = getCursor(context);851    const match = /^[^\t\r\n\f />][^\t\r\n\f />=]*/.exec(context.source);852    const name = match[0];853    if (nameSet.has(name)) {854        emitError(context, 2 /* DUPLICATE_ATTRIBUTE */);855    }856    nameSet.add(name);857    if (name[0] === '=') {858        emitError(context, 19 /* UNEXPECTED_EQUALS_SIGN_BEFORE_ATTRIBUTE_NAME */);859    }860    {861        const pattern = /["'<]/g;862        let m;863        while ((m = pattern.exec(name))) {864            emitError(context, 17 /* UNEXPECTED_CHARACTER_IN_ATTRIBUTE_NAME */, m.index);865        }866    }867    advanceBy(context, name.length);868    // Value869    let value = undefined;870    if (/^[\t\r\n\f ]*=/.test(context.source)) {871        advanceSpaces(context);872        advanceBy(context, 1);873        advanceSpaces(context);874        value = parseAttributeValue(context);875        if (!value) {876            emitError(context, 13 /* MISSING_ATTRIBUTE_VALUE */);877        }878    }879    const loc = getSelection(context, start);880    if (!context.inVPre && /^(v-|:|@|#)/.test(name)) {881        const match = /(?:^v-([a-z0-9-]+))?(?:(?::|^@|^#)(\[[^\]]+\]|[^\.]+))?(.+)?$/i.exec(name);882        const dirName = match[1] ||883            (startsWith(name, ':') ? 'bind' : startsWith(name, '@') ? 'on' : 'slot');884        let arg;885        if (match[2]) {886            const isSlot = dirName === 'slot';887            const startOffset = name.indexOf(match[2]);888            const loc = getSelection(889                context, 890                getNewPosition(context, start, startOffset), 891                getNewPosition(context, start, startOffset + match[2].length + ((isSlot && match[3]) || '').length)892            );893            let content = match[2];894            let isStatic = true;895            if (content.startsWith('[')) {896                isStatic = false;897                if (!content.endsWith(']')) {898                    emitError(context, 26 /* X_MISSING_DYNAMIC_DIRECTIVE_ARGUMENT_END */);899                }900                content = content.substr(1, content.length - 2);901            }902            else if (isSlot) {903                // #1241 special case for v-slot: vuetify relies extensively on slot904                // names containing dots. v-slot doesn't have any modifiers and Vue 2.x905                // supports such usage so we are keeping it consistent with 2.x.906                content += match[3] || '';907            }908            arg = {909                type: 4 /* SIMPLE_EXPRESSION */,910                content,911                isStatic,912                isConstant: isStatic,913                loc914            };915        }916        if (value && value.isQuoted) {917            const valueLoc = value.loc;918            valueLoc.start.offset++;919            valueLoc.start.column++;920            valueLoc.end = advancePositionWithClone(valueLoc.start, value.content);921            valueLoc.source = valueLoc.source.slice(1, -1);922        }923        return {924            type: 7 /* DIRECTIVE */,925            name: dirName,926            exp: value && {927                type: 4 /* SIMPLE_EXPRESSION */,928                content: value.content,929                isStatic: false,930                // Treat as non-constant by default. This can be potentially set to931                // true by `transformExpression` to make it eligible for hoisting.932                isConstant: false,933                loc: value.loc934            },935            arg,936            modifiers: match[3] ? match[3].substr(1).split('.') : [],937            loc938        };939    }940    return {941        type: 6 /* ATTRIBUTE */,942        name,943        value: value && {944            type: 2 /* TEXT */,945            content: value.content,946            loc: value.loc947        },948        loc949    };950}951function parseAttributeValue(context) {952    const start = getCursor(context);953    let content;954    const quote = context.source[0];955    const isQuoted = quote === `"` || quote === `'`;956    if (isQuoted) {957        // Quoted value.958        advanceBy(context, 1);959        const endIndex = context.source.indexOf(quote);960        if (endIndex === -1) {961            content = parseTextData(context, context.source.length, 4 /* ATTRIBUTE_VALUE */);962        }963        else {964            content = parseTextData(context, endIndex, 4 /* ATTRIBUTE_VALUE */);965            advanceBy(context, 1);966        }967    }968    else {969        // Unquoted970        const match = /^[^\t\r\n\f >]+/.exec(context.source);971        if (!match) {972            return undefined;973        }974        const unexpectedChars = /["'<=`]/g;975        let m;976        while ((m = unexpectedChars.exec(match[0]))) {977            emitError(context, 18 /* UNEXPECTED_CHARACTER_IN_UNQUOTED_ATTRIBUTE_VALUE */, m.index);978        }979        content = parseTextData(context, match[0].length, 4 /* ATTRIBUTE_VALUE */);980    }981    return { content, isQuoted, loc: getSelection(context, start) };982}983/**984 * Get text data with a given length from the current location.985 * This translates HTML entities in the text data.986 */987function parseTextData(context, length, mode) {988    const rawText = context.source.slice(0, length);989    advanceBy(context, length);990    if (mode === 2 /* RAWTEXT */ ||991        mode === 3 /* CDATA */ ||992        rawText.indexOf('&') === -1) {993        return rawText;994    }995    else {996        // DATA or RCDATA containing "&"". Entity decoding required.997        return context.options.decodeEntities(rawText, mode === 4 /* ATTRIBUTE_VALUE */);998    }999}1000function getSelection(context, start, end) {1001    end = end || getCursor(context);1002    return {1003        start,1004        end,1005        source: context.originalSource.slice(start.offset, end.offset)1006    };1007}1008function getNewPosition(context, start, numberOfCharacters) {1009    return advancePositionWithClone(start, context.originalSource.slice(start.offset, numberOfCharacters), numberOfCharacters);1010}1011function advancePositionWithClone(pos, source, numberOfCharacters = source.length) {1012    return advancePositionWithMutation(extend({}, pos), source, numberOfCharacters);1013}1014// advance by mutation without cloning (for performance reasons), since this1015// gets called a lot in the parser1016function advancePositionWithMutation(pos, source, numberOfCharacters = source.length) {1017    let linesCount = 0;1018    let lastNewLinePos = -1;1019    for (let i = 0; i < numberOfCharacters; i++) {1020        if (source.charCodeAt(i) === 10 /* newline char code */) {1021            linesCount++;1022            lastNewLinePos = i;1023        }1024    }1025    pos.offset += numberOfCharacters;1026    pos.line += linesCount;1027    pos.column =1028        lastNewLinePos === -11029            ? pos.column + numberOfCharacters1030            : numberOfCharacters - lastNewLinePos;1031    return pos;1032}1033/**1034 * IF-node1035 * type: 91036 * ifNode = {1037        type: 9,1038        loc: node.loc,1039        branches: [branch]1040    };1041 */1042/**1043 * IF-BRANCH1044 * type: 101045*1046{1047    type: 10,1048    loc: node.loc,1049    condition: dir.name === 'else' ? undefined : dir.exp,1050    children: node.tagType === 3  && !findDir(node, 'for')1051        ? node.children1052        : [node],1053        userKey: findProp(node, `key`)1054    };1055*/1056function createIfBranch(node, dir) {1057    return {1058        type: 10 /* IF_BRANCH */,1059        loc: node.loc,1060        condition: dir.name === 'else' ? undefined : dir.exp,1061        children: node.tagType === 3 /* TEMPLATE */ && !findDir(node, 'for')1062            ? node.children1063            : [node],1064        userKey: findProp(node, `key`)1065    };...

compiler-dom.esm-bundler.js

Source:compiler-dom.esm-bundler.js

...24    [TRANSITION_GROUP]: `TransitionGroup`25});26/* eslint-disable no-restricted-globals */27let decoder;28function decodeHtmlBrowser(raw, asAttr = false) {29    if (!decoder) {30        decoder = document.createElement('div');31    }32    if (asAttr) {33        decoder.innerHTML = `<div foo="${raw.replace(/"/g, '&quot;')}">`;34        return decoder.children[0].getAttribute('foo');35    }36    else {37        decoder.innerHTML = raw;38        return decoder.textContent;39    }40}41const isRawTextContainer = /*#__PURE__*/ makeMap('style,iframe,script,noscript', true);42const parserOptions = {...

parserOptions.js

Source:parserOptions.js

1import { makeMap, isVoidTag, isHTMLTag, isSVGTag } from '../shared/index.js'2import { decodeHtmlBrowser } from './decodeHtmlBrowser.js'3import { isBuiltInType } from '../compiler-core/utils.js'4import { TRANSITION } from './runtimeHelpers.js'5const isRawTextContainer = /*#__PURE__*/ makeMap(6  'style,iframe,script,noscript',7  true8)9export const parserOptions = {10  isVoidTag,11  isNativeTag: tag => isHTMLTag(tag) || isSVGTag(tag),12  isPreTag: tag => tag === 'pre',13  decodeEntities: decodeHtmlBrowser,14  isBuiltInComponent: tag => {15    if (isBuiltInType(tag, `Transition`)) {16      return TRANSITION17    } else if (isBuiltInType(tag, `TransitionGroup`)) {18      return TRANSITION_GROUP19    }20  },21  getNamespace (tag, parent) {22    let ns = parent ? parent.ns : 023    if (parent && ns === 2) {24      if (parent.tag === 'annotation-xml') {25        if (tag === 'svg') {26          return 127        }28        if (29          parent.props.some(30            a =>31              a.type === 6 &&32              a.name === 'encoding' &&33              a.value != null &&34              (a.value.content === 'text/html' ||35                a.value.content === 'application/xhtml+xml')36          )37        ) {38          ns = 039        }40      } else if (41        /^m(?:[ions]|text)$/.test(parent.tag) &&42        tag !== 'mglyph' &&43        tag !== 'malignmark'44      ) {45        ns = 046      }47    } else if (parent && ns === 1) {48      if (49        parent.tag === 'foreignObject' ||50        parent.tag === 'desc' ||51        parent.tag === 'title'52      ) {53        ns = 054      }55    }56    if (ns === 0) {57      if (tag === 'svg') {58        return 159      }60      if (tag === 'math') {61        return 262      }63    }64    return ns65  },66  getTextMode ({ tag, ns }) {67    if (ns === 0) {68      if (tag === 'textarea' || tag === 'title') {69        return 170      }71      if (isRawTextContainer(tag)) {72        return 273      }74    }75    return 076  }...

02-compile-dom.js

Source:02-compile-dom.js

1export const parserOptions: ParserOptions = {2    isVoidTag,3    isNativeTag: tag => isHTMLTag(tag) || isSVGTag(tag),4    isPreTag: tag => tag === 'pre',5    decodeEntities: __BROWSER__ ? decodeHtmlBrowser : decodeHtml,6  7    isBuiltInComponent: (tag: string): symbol | undefined => {8      if (isBuiltInType(tag, `Transition`)) {9        return TRANSITION10      } else if (isBuiltInType(tag, `TransitionGroup`)) {11        return TRANSITION_GROUP12      }13    },14    ...15  }16  const HTML_TAGS =17    'html,body,base,head,link,meta,style,title,address,article,aside,footer,' +18    'header,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,' +19    'figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,' +20    'data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,' +21    'time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,' +22    'canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,' +23    'th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,' +24    'option,output,progress,select,textarea,details,dialog,menu,' +25    'summary,template,blockquote,iframe,tfoot'...

decodeHtmlBrowser.js

Source:decodeHtmlBrowser.js

1let decoder2export function decodeHtmlBrowser(raw, asAttr = false) {3  if (!decoder) {4    decoder = document.createElement('div')5  }6  if (asAttr) {7    decoder.innerHTML = `<div foo="${raw.replace(/"/g, '&quot;')}">`8    return decoder.children[0].getAttribute('foo')9  } else {10    decoder.innerHTML = raw11    return decoder.textContent12  }...

Using AI Code Generation

1const { decodeHtmlBrowser } = require('@playwright/test/lib/server/frames');2const decodedHTML = decodeHtmlBrowser('<div>hello</div>');3const { expect } = require('@playwright/test');4expect(3).toBe(3);5const { test } = require('@playwright/test');6test('test', async ({ page }) => {7  const title = page.locator('text=Playwright');8  await expect(title).toBeVisible();9});10const { worker } = require('@playwright/test');11worker('test', async ({ page }) => {12  const title = page.locator('text=Playwright');13  await expect(title).toBeVisible();14});15const { test, step } = require('@playwright/test');16test('test', async ({ page }) => {17  const title = page.locator('text=Playwright');18  await step('step1', async () => {19    await expect(title).toBeVisible();20  });21});

Using AI Code Generation

1const { decodeHtmlBrowser } = require('playwright/lib/server/supplements/recorder/recorderSupplement');2console.log(decodeHtmlBrowser('&#x2F;'));3const { decodeHtmlBrowser } = require('playwright/lib/server/supplements/recorder/recorderSupplement');4console.log(decodeHtmlBrowser('&#x2F;'));5const { decodeHtmlBrowser } = require('playwright/lib/server/supplements/recorder/recorderSupplement');6console.log(decodeHtmlBrowser('&#x2F;'));7const { decodeHtmlBrowser } = require('playwright/lib/server/supplements/recorder/recorderSupplement');8console.log(decodeHtmlBrowser('&#x2F;'));9const { decodeHtmlBrowser } = require('playwright/lib/server/supplements/recorder/recorderSupplement');10console.log(decodeHtmlBrowser('&#x2F;'));11const { decodeHtmlBrowser } = require('playwright/lib/server/supplements/recorder/recorderSupplement');12console.log(decodeHtmlBrowser('&#x2F;'));13const { decodeHtmlBrowser } = require('playwright/lib/server/supplements/recorder/recorderSupplement');14console.log(decodeHtmlBrowser('&#x2F;'));

Playwright tutorial

LambdaTest’s Playwright tutorial will give you a broader idea about the Playwright automation framework, its unique features, and use cases with examples to exceed your understanding of Playwright testing. This tutorial will give A to Z guidance, from installing the Playwright framework to some best practices and advanced concepts.

Chapters:

What is Playwright : Playwright is comparatively new but has gained good popularity. Get to know some history of the Playwright with some interesting facts connected with it.
How To Install Playwright : Learn in detail about what basic configuration and dependencies are required for installing Playwright and run a test. Get a step-by-step direction for installing the Playwright automation framework.
Playwright Futuristic Features: Launched in 2020, Playwright gained huge popularity quickly because of some obliging features such as Playwright Test Generator and Inspector, Playwright Reporter, Playwright auto-waiting mechanism and etc. Read up on those features to master Playwright testing.
What is Component Testing: Component testing in Playwright is a unique feature that allows a tester to test a single component of a web application without integrating them with other elements. Learn how to perform Component testing on the Playwright automation framework.
Inputs And Buttons In Playwright: Every website has Input boxes and buttons; learn about testing inputs and buttons with different scenarios and examples.
Functions and Selectors in Playwright: Learn how to launch the Chromium browser with Playwright. Also, gain a better understanding of some important functions like “BrowserContext,” which allows you to run multiple browser sessions, and “newPage” which interacts with a page.
Handling Alerts and Dropdowns in Playwright : Playwright interact with different types of alerts and pop-ups, such as simple, confirmation, and prompt, and different types of dropdowns, such as single selector and multi-selector get your hands-on with handling alerts and dropdown in Playright testing.
Playwright vs Puppeteer: Get to know about the difference between two testing frameworks and how they are different than one another, which browsers they support, and what features they provide.
Run Playwright Tests on LambdaTest: Playwright testing with LambdaTest leverages test performance to the utmost. You can run multiple Playwright tests in Parallel with the LammbdaTest test cloud. Get a step-by-step guide to run your Playwright test on the LambdaTest platform.
Playwright Python Tutorial: Playwright automation framework support all major languages such as Python, JavaScript, TypeScript, .NET and etc. However, there are various advantages to Python end-to-end testing with Playwright because of its versatile utility. Get the hang of Playwright python testing with this chapter.
Playwright End To End Testing Tutorial: Get your hands on with Playwright end-to-end testing and learn to use some exciting features such as TraceViewer, Debugging, Networking, Component testing, Visual testing, and many more.
Playwright Video Tutorial: Watch the video tutorials on Playwright testing from experts and get a consecutive in-depth explanation of Playwright automation testing.