Skip to content

Commit

Permalink
fix: 修复innerHTML生成小程序时的相关逻辑. 对于a标签,逻辑保持跟直接a标签基本一致
Browse files Browse the repository at this point in the history
  • Loading branch information
zhengyanan1 committed Nov 13, 2024
1 parent 3f37c8f commit b1b4127
Show file tree
Hide file tree
Showing 2 changed files with 52 additions and 6 deletions.
32 changes: 28 additions & 4 deletions packages/taro-runtime/src/dom-external/inner-html/parser.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { isFunction } from '@tarojs/shared'
import { options } from '../../options'
import { Scaner, Token } from './scaner'
import StyleTagParser from './style'
import { isBlockElements, isInlineElements, isMiniElements, specialMiniElements } from './tags'
import { getSpecialElementMapping, isBlockElements, isInlineElements, isMiniElements, isSpecialElements, specialMiniElements } from './tags'
import { unquote } from './utils'

import type { TaroDocument } from '../../dom/document'
Expand Down Expand Up @@ -47,7 +47,7 @@ export interface Element extends Node {
attributes: string[]
}

export interface ParsedTaroElement extends TaroElement{
export interface ParsedTaroElement extends TaroElement {
h5tagName?: string
}

Expand All @@ -71,7 +71,23 @@ function hasTerminalParent (tagName: string, stack: Element[]) {
return false
}

function getTagName (tag: string) {
/**
* 将属性数组转换为属性对象
* @param attributes 字符串数组,包含属性信息
* @returns 属性对象,键为属性名,值为属性值或true
*/
function attributesArray2Props (attributes: string[]): Record<string, string | true> {
const props: Record<string, string | true> = {}
for (let i = 0; i < attributes.length; i++) {
const attr = attributes[i]
const [key, value] = splitEqual(attr)

Check warning on line 83 in packages/taro-runtime/src/dom-external/inner-html/parser.ts

View check run for this annotation

Codecov / codecov/patch

packages/taro-runtime/src/dom-external/inner-html/parser.ts#L79-L83

Added lines #L79 - L83 were not covered by tests
props[key] = value == null ? true : unquote(value)
}

return props

Check warning on line 87 in packages/taro-runtime/src/dom-external/inner-html/parser.ts

View check run for this annotation

Codecov / codecov/patch

packages/taro-runtime/src/dom-external/inner-html/parser.ts#L87

Added line #L87 was not covered by tests
}

function getTagName (tag: string, attributes: string[]) {
if (options.html!.renderHTMLTag) {
return tag
}
Expand All @@ -84,6 +100,14 @@ function getTagName (tag: string) {
return 'view'
} else if (isInlineElements(tag)) {
return 'text'
} else if (isSpecialElements(tag)) {
// if it's special tag, the real tag is determined by the config mapping
const mapping = getSpecialElementMapping(tag)
const props = attributesArray2Props(attributes)

Check warning on line 106 in packages/taro-runtime/src/dom-external/inner-html/parser.ts

View check run for this annotation

Codecov / codecov/patch

packages/taro-runtime/src/dom-external/inner-html/parser.ts#L105-L106

Added lines #L105 - L106 were not covered by tests

if (mapping) {
return mapping.mapName(props)

Check warning on line 109 in packages/taro-runtime/src/dom-external/inner-html/parser.ts

View check run for this annotation

Codecov / codecov/patch

packages/taro-runtime/src/dom-external/inner-html/parser.ts#L109

Added line #L109 was not covered by tests
}
}

return 'view'
Expand Down Expand Up @@ -146,7 +170,7 @@ function format (
child.attributes.push(`style=${styleText.replace(/['"]/g, '')}`)

Check warning on line 170 in packages/taro-runtime/src/dom-external/inner-html/parser.ts

View check run for this annotation

Codecov / codecov/patch

packages/taro-runtime/src/dom-external/inner-html/parser.ts#L169-L170

Added lines #L169 - L170 were not covered by tests
}

const el: ParsedTaroElement = document.createElement(getTagName(child.tagName))
const el: ParsedTaroElement = document.createElement(getTagName(child.tagName, child.attributes))
el.h5tagName = child.tagName

parent?.appendChild(el)
Expand Down
26 changes: 24 additions & 2 deletions packages/taro-runtime/src/dom-external/inner-html/tags.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { internalComponents } from '@tarojs/shared'
import { internalComponents, isString } from '@tarojs/shared'

export function makeMap (
str: string,
Expand All @@ -17,6 +17,25 @@ export const specialMiniElements = {
iframe: 'web-view'
}

interface SpecialMap {
mapName: (props: Record<string, string | boolean>) => string
}

const specialElements = new Map<string, SpecialMap>([
['a', {
mapName (props) {

Check warning on line 26 in packages/taro-runtime/src/dom-external/inner-html/tags.ts

View check run for this annotation

Codecov / codecov/patch

packages/taro-runtime/src/dom-external/inner-html/tags.ts#L26

Added line #L26 was not covered by tests
if (props.as && isString(props.as)) return props.as.toLowerCase()
return !props.href || isString(props.href) && (/^javascript/.test(props.href)) ? 'view' : 'navigator'
}
}],
])

export const getSpecialElementMapping = (tag: string, expectsLowerCase:boolean = true) => {
tag = expectsLowerCase ? tag.toLowerCase() : tag
return specialElements.get(tag)

Check warning on line 35 in packages/taro-runtime/src/dom-external/inner-html/tags.ts

View check run for this annotation

Codecov / codecov/patch

packages/taro-runtime/src/dom-external/inner-html/tags.ts#L35

Added line #L35 was not covered by tests
}


const internalCompsList = Object.keys(internalComponents)
.map(i => i.toLowerCase())
.join(',')
Expand All @@ -25,7 +44,10 @@ const internalCompsList = Object.keys(internalComponents)
export const isMiniElements = makeMap(internalCompsList, true)

// https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elements
export const isInlineElements = makeMap('a,i,abbr,iframe,select,acronym,slot,small,span,bdi,kbd,strong,big,map,sub,sup,br,mark,mark,meter,template,canvas,textarea,cite,object,time,code,output,u,data,picture,tt,datalist,var,dfn,del,q,em,s,embed,samp,b', true)
export const isInlineElements = makeMap('i,abbr,iframe,select,acronym,slot,small,span,bdi,kbd,strong,big,map,sub,sup,br,mark,mark,meter,template,canvas,textarea,cite,object,time,code,output,u,data,picture,tt,datalist,var,dfn,del,q,em,s,embed,samp,b', true)

// https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements
export const isBlockElements = makeMap('address,fieldset,li,article,figcaption,main,aside,figure,nav,blockquote,footer,ol,details,form,p,dialog,h1,h2,h3,h4,h5,h6,pre,dd,header,section,div,hgroup,table,dl,hr,ul,dt', true)

// specialElements
export const isSpecialElements = makeMap('a', true)

0 comments on commit b1b4127

Please sign in to comment.