LibWeb: Parse and propagate text-wrap-mode CSS property

This commit is contained in:
Callum Law 2025-05-18 00:49:25 +12:00 committed by Jelle Raaijmakers
commit 50bdd2cb85
Notes: github-actions[bot] 2025-05-29 10:06:06 +00:00
16 changed files with 333 additions and 183 deletions

View file

@ -1180,6 +1180,12 @@ Vector<ShadowData> ComputedProperties::text_shadow(Layout::Node const& layout_no
return shadow(PropertyID::TextShadow, layout_node); return shadow(PropertyID::TextShadow, layout_node);
} }
TextWrapMode ComputedProperties::text_wrap_mode() const
{
auto const& value = property(PropertyID::TextWrapMode);
return keyword_to_text_wrap_mode(value.to_keyword()).release_value();
}
BoxSizing ComputedProperties::box_sizing() const BoxSizing ComputedProperties::box_sizing() const
{ {
auto const& value = property(PropertyID::BoxSizing); auto const& value = property(PropertyID::BoxSizing);

View file

@ -111,6 +111,7 @@ public:
TextDecorationStyle text_decoration_style() const; TextDecorationStyle text_decoration_style() const;
TextTransform text_transform() const; TextTransform text_transform() const;
Vector<ShadowData> text_shadow(Layout::Node const&) const; Vector<ShadowData> text_shadow(Layout::Node const&) const;
TextWrapMode text_wrap_mode() const;
ListStyleType list_style_type() const; ListStyleType list_style_type() const;
ListStylePosition list_style_position() const; ListStylePosition list_style_position() const;
FlexDirection flex_direction() const; FlexDirection flex_direction() const;

View file

@ -115,6 +115,7 @@ public:
static CSS::TextTransform text_transform() { return CSS::TextTransform::None; } static CSS::TextTransform text_transform() { return CSS::TextTransform::None; }
static CSS::TextOverflow text_overflow() { return CSS::TextOverflow::Clip; } static CSS::TextOverflow text_overflow() { return CSS::TextOverflow::Clip; }
static CSS::LengthPercentage text_indent() { return CSS::Length::make_px(0); } static CSS::LengthPercentage text_indent() { return CSS::Length::make_px(0); }
static CSS::TextWrapMode text_wrap_mode() { return CSS::TextWrapMode::Wrap; }
static CSS::Display display() { return CSS::Display { CSS::DisplayOutside::Inline, CSS::DisplayInside::Flow }; } static CSS::Display display() { return CSS::Display { CSS::DisplayOutside::Inline, CSS::DisplayInside::Flow }; }
static Color color() { return Color::Black; } static Color color() { return Color::Black; }
static Color stop_color() { return Color::Black; } static Color stop_color() { return Color::Black; }
@ -415,6 +416,7 @@ public:
CSS::TextAlign text_align() const { return m_inherited.text_align; } CSS::TextAlign text_align() const { return m_inherited.text_align; }
CSS::TextJustify text_justify() const { return m_inherited.text_justify; } CSS::TextJustify text_justify() const { return m_inherited.text_justify; }
CSS::LengthPercentage const& text_indent() const { return m_inherited.text_indent; } CSS::LengthPercentage const& text_indent() const { return m_inherited.text_indent; }
CSS::TextWrapMode text_wrap_mode() const { return m_inherited.text_wrap_mode; }
Vector<CSS::TextDecorationLine> const& text_decoration_line() const { return m_noninherited.text_decoration_line; } Vector<CSS::TextDecorationLine> const& text_decoration_line() const { return m_noninherited.text_decoration_line; }
CSS::LengthPercentage const& text_decoration_thickness() const { return m_noninherited.text_decoration_thickness; } CSS::LengthPercentage const& text_decoration_thickness() const { return m_noninherited.text_decoration_thickness; }
CSS::TextDecorationStyle text_decoration_style() const { return m_noninherited.text_decoration_style; } CSS::TextDecorationStyle text_decoration_style() const { return m_noninherited.text_decoration_style; }
@ -617,6 +619,7 @@ protected:
CSS::TextJustify text_justify { InitialValues::text_justify() }; CSS::TextJustify text_justify { InitialValues::text_justify() };
CSS::TextTransform text_transform { InitialValues::text_transform() }; CSS::TextTransform text_transform { InitialValues::text_transform() };
CSS::LengthPercentage text_indent { InitialValues::text_indent() }; CSS::LengthPercentage text_indent { InitialValues::text_indent() };
CSS::TextWrapMode text_wrap_mode { InitialValues::text_wrap_mode() };
CSS::WhiteSpace white_space { InitialValues::white_space() }; CSS::WhiteSpace white_space { InitialValues::white_space() };
CSS::WhiteSpaceCollapse white_space_collapse { InitialValues::white_space_collapse() }; CSS::WhiteSpaceCollapse white_space_collapse { InitialValues::white_space_collapse() };
CSS::WordBreak word_break { InitialValues::word_break() }; CSS::WordBreak word_break { InitialValues::word_break() };
@ -818,6 +821,7 @@ public:
void set_text_transform(CSS::TextTransform value) { m_inherited.text_transform = value; } void set_text_transform(CSS::TextTransform value) { m_inherited.text_transform = value; }
void set_text_shadow(Vector<ShadowData>&& value) { m_inherited.text_shadow = move(value); } void set_text_shadow(Vector<ShadowData>&& value) { m_inherited.text_shadow = move(value); }
void set_text_indent(CSS::LengthPercentage value) { m_inherited.text_indent = move(value); } void set_text_indent(CSS::LengthPercentage value) { m_inherited.text_indent = move(value); }
void set_text_wrap_mode(CSS::TextWrapMode value) { m_inherited.text_wrap_mode = value; }
void set_text_overflow(CSS::TextOverflow value) { m_noninherited.text_overflow = value; } void set_text_overflow(CSS::TextOverflow value) { m_noninherited.text_overflow = value; }
void set_webkit_text_fill_color(Color value) { m_inherited.webkit_text_fill_color = value; } void set_webkit_text_fill_color(Color value) { m_inherited.webkit_text_fill_color = value; }
void set_position(CSS::Positioning position) { m_noninherited.position = position; } void set_position(CSS::Positioning position) { m_noninherited.position = position; }

View file

@ -617,6 +617,10 @@
"none", "none",
"uppercase" "uppercase"
], ],
"text-wrap-mode": [
"wrap",
"nowrap"
],
"touch-action": [ "touch-action": [
"auto", "auto",
"manipulation", "manipulation",

View file

@ -2937,6 +2937,14 @@
"text-transform" "text-transform"
] ]
}, },
"text-wrap-mode": {
"animation-type": "discrete",
"inherited": true,
"initial": "wrap",
"valid-types": [
"text-wrap-mode"
]
},
"top": { "top": {
"animation-type": "by-computed-value", "animation-type": "by-computed-value",
"inherited": false, "inherited": false,

View file

@ -640,6 +640,7 @@ void NodeWithStyle::apply_style(CSS::ComputedProperties const& computed_style)
if (auto text_indent = computed_style.length_percentage(CSS::PropertyID::TextIndent); text_indent.has_value()) if (auto text_indent = computed_style.length_percentage(CSS::PropertyID::TextIndent); text_indent.has_value())
computed_values.set_text_indent(text_indent.release_value()); computed_values.set_text_indent(text_indent.release_value());
computed_values.set_text_wrap_mode(computed_style.text_wrap_mode());
computed_values.set_tab_size(computed_style.tab_size()); computed_values.set_tab_size(computed_style.tab_size());
computed_values.set_white_space(computed_style.white_space()); computed_values.set_white_space(computed_style.white_space());

View file

@ -433,7 +433,7 @@ bool pseudo_element_supports_property(PseudoElement pseudo_element, PropertyID p
// FIXME: text-spacing-trim // FIXME: text-spacing-trim
append_property("text-transform"sv); append_property("text-transform"sv);
// FIXME: text-wrap // FIXME: text-wrap
// FIXME: text-wrap-mode append_property("text-wrap-mode"sv);
// FIXME: text-wrap-style // FIXME: text-wrap-style
append_property("white-space"sv); append_property("white-space"sv);
append_property("white-space-collapse"sv); append_property("white-space-collapse"sv);

View file

@ -56,186 +56,187 @@ All properties associated with getComputedStyle(document.body):
"53": "text-justify", "53": "text-justify",
"54": "text-shadow", "54": "text-shadow",
"55": "text-transform", "55": "text-transform",
"56": "visibility", "56": "text-wrap-mode",
"57": "white-space", "57": "visibility",
"58": "white-space-collapse", "58": "white-space",
"59": "word-break", "59": "white-space-collapse",
"60": "word-spacing", "60": "word-break",
"61": "word-wrap", "61": "word-spacing",
"62": "writing-mode", "62": "word-wrap",
"63": "align-content", "63": "writing-mode",
"64": "align-items", "64": "align-content",
"65": "align-self", "65": "align-items",
"66": "animation-delay", "66": "align-self",
"67": "animation-direction", "67": "animation-delay",
"68": "animation-duration", "68": "animation-direction",
"69": "animation-fill-mode", "69": "animation-duration",
"70": "animation-iteration-count", "70": "animation-fill-mode",
"71": "animation-name", "71": "animation-iteration-count",
"72": "animation-play-state", "72": "animation-name",
"73": "animation-timing-function", "73": "animation-play-state",
"74": "appearance", "74": "animation-timing-function",
"75": "aspect-ratio", "75": "appearance",
"76": "backdrop-filter", "76": "aspect-ratio",
"77": "background-attachment", "77": "backdrop-filter",
"78": "background-blend-mode", "78": "background-attachment",
"79": "background-clip", "79": "background-blend-mode",
"80": "background-color", "80": "background-clip",
"81": "background-image", "81": "background-color",
"82": "background-origin", "82": "background-image",
"83": "background-position-x", "83": "background-origin",
"84": "background-position-y", "84": "background-position-x",
"85": "background-repeat", "85": "background-position-y",
"86": "background-size", "86": "background-repeat",
"87": "block-size", "87": "background-size",
"88": "border-block-end-color", "88": "block-size",
"89": "border-block-end-style", "89": "border-block-end-color",
"90": "border-block-end-width", "90": "border-block-end-style",
"91": "border-block-start-color", "91": "border-block-end-width",
"92": "border-block-start-style", "92": "border-block-start-color",
"93": "border-block-start-width", "93": "border-block-start-style",
"94": "border-bottom-color", "94": "border-block-start-width",
"95": "border-bottom-left-radius", "95": "border-bottom-color",
"96": "border-bottom-right-radius", "96": "border-bottom-left-radius",
"97": "border-bottom-style", "97": "border-bottom-right-radius",
"98": "border-bottom-width", "98": "border-bottom-style",
"99": "border-inline-end-color", "99": "border-bottom-width",
"100": "border-inline-end-style", "100": "border-inline-end-color",
"101": "border-inline-end-width", "101": "border-inline-end-style",
"102": "border-inline-start-color", "102": "border-inline-end-width",
"103": "border-inline-start-style", "103": "border-inline-start-color",
"104": "border-inline-start-width", "104": "border-inline-start-style",
"105": "border-left-color", "105": "border-inline-start-width",
"106": "border-left-style", "106": "border-left-color",
"107": "border-left-width", "107": "border-left-style",
"108": "border-right-color", "108": "border-left-width",
"109": "border-right-style", "109": "border-right-color",
"110": "border-right-width", "110": "border-right-style",
"111": "border-top-color", "111": "border-right-width",
"112": "border-top-left-radius", "112": "border-top-color",
"113": "border-top-right-radius", "113": "border-top-left-radius",
"114": "border-top-style", "114": "border-top-right-radius",
"115": "border-top-width", "115": "border-top-style",
"116": "bottom", "116": "border-top-width",
"117": "box-shadow", "117": "bottom",
"118": "box-sizing", "118": "box-shadow",
"119": "clear", "119": "box-sizing",
"120": "clip", "120": "clear",
"121": "clip-path", "121": "clip",
"122": "column-count", "122": "clip-path",
"123": "column-gap", "123": "column-count",
"124": "column-span", "124": "column-gap",
"125": "column-width", "125": "column-span",
"126": "contain", "126": "column-width",
"127": "content", "127": "contain",
"128": "content-visibility", "128": "content",
"129": "counter-increment", "129": "content-visibility",
"130": "counter-reset", "130": "counter-increment",
"131": "counter-set", "131": "counter-reset",
"132": "cx", "132": "counter-set",
"133": "cy", "133": "cx",
"134": "display", "134": "cy",
"135": "filter", "135": "display",
"136": "flex-basis", "136": "filter",
"137": "flex-direction", "137": "flex-basis",
"138": "flex-grow", "138": "flex-direction",
"139": "flex-shrink", "139": "flex-grow",
"140": "flex-wrap", "140": "flex-shrink",
"141": "float", "141": "flex-wrap",
"142": "grid-auto-columns", "142": "float",
"143": "grid-auto-flow", "143": "grid-auto-columns",
"144": "grid-auto-rows", "144": "grid-auto-flow",
"145": "grid-column-end", "145": "grid-auto-rows",
"146": "grid-column-start", "146": "grid-column-end",
"147": "grid-row-end", "147": "grid-column-start",
"148": "grid-row-start", "148": "grid-row-end",
"149": "grid-template-areas", "149": "grid-row-start",
"150": "grid-template-columns", "150": "grid-template-areas",
"151": "grid-template-rows", "151": "grid-template-columns",
"152": "height", "152": "grid-template-rows",
"153": "inline-size", "153": "height",
"154": "inset-block-end", "154": "inline-size",
"155": "inset-block-start", "155": "inset-block-end",
"156": "inset-inline-end", "156": "inset-block-start",
"157": "inset-inline-start", "157": "inset-inline-end",
"158": "isolation", "158": "inset-inline-start",
"159": "justify-content", "159": "isolation",
"160": "justify-items", "160": "justify-content",
"161": "justify-self", "161": "justify-items",
"162": "left", "162": "justify-self",
"163": "margin-block-end", "163": "left",
"164": "margin-block-start", "164": "margin-block-end",
"165": "margin-bottom", "165": "margin-block-start",
"166": "margin-inline-end", "166": "margin-bottom",
"167": "margin-inline-start", "167": "margin-inline-end",
"168": "margin-left", "168": "margin-inline-start",
"169": "margin-right", "169": "margin-left",
"170": "margin-top", "170": "margin-right",
"171": "mask-image", "171": "margin-top",
"172": "mask-type", "172": "mask-image",
"173": "max-block-size", "173": "mask-type",
"174": "max-height", "174": "max-block-size",
"175": "max-inline-size", "175": "max-height",
"176": "max-width", "176": "max-inline-size",
"177": "min-block-size", "177": "max-width",
"178": "min-height", "178": "min-block-size",
"179": "min-inline-size", "179": "min-height",
"180": "min-width", "180": "min-inline-size",
"181": "mix-blend-mode", "181": "min-width",
"182": "object-fit", "182": "mix-blend-mode",
"183": "object-position", "183": "object-fit",
"184": "opacity", "184": "object-position",
"185": "order", "185": "opacity",
"186": "outline-color", "186": "order",
"187": "outline-offset", "187": "outline-color",
"188": "outline-style", "188": "outline-offset",
"189": "outline-width", "189": "outline-style",
"190": "overflow-x", "190": "outline-width",
"191": "overflow-y", "191": "overflow-x",
"192": "padding-block-end", "192": "overflow-y",
"193": "padding-block-start", "193": "padding-block-end",
"194": "padding-bottom", "194": "padding-block-start",
"195": "padding-inline-end", "195": "padding-bottom",
"196": "padding-inline-start", "196": "padding-inline-end",
"197": "padding-left", "197": "padding-inline-start",
"198": "padding-right", "198": "padding-left",
"199": "padding-top", "199": "padding-right",
"200": "position", "200": "padding-top",
"201": "r", "201": "position",
"202": "right", "202": "r",
"203": "rotate", "203": "right",
"204": "row-gap", "204": "rotate",
"205": "rx", "205": "row-gap",
"206": "ry", "206": "rx",
"207": "scale", "207": "ry",
"208": "scrollbar-gutter", "208": "scale",
"209": "scrollbar-width", "209": "scrollbar-gutter",
"210": "stop-color", "210": "scrollbar-width",
"211": "stop-opacity", "211": "stop-color",
"212": "table-layout", "212": "stop-opacity",
"213": "text-decoration-color", "213": "table-layout",
"214": "text-decoration-style", "214": "text-decoration-color",
"215": "text-decoration-thickness", "215": "text-decoration-style",
"216": "text-overflow", "216": "text-decoration-thickness",
"217": "top", "217": "text-overflow",
"218": "touch-action", "218": "top",
"219": "transform", "219": "touch-action",
"220": "transform-box", "220": "transform",
"221": "transform-origin", "221": "transform-box",
"222": "transition-behavior", "222": "transform-origin",
"223": "transition-delay", "223": "transition-behavior",
"224": "transition-duration", "224": "transition-delay",
"225": "transition-property", "225": "transition-duration",
"226": "transition-timing-function", "226": "transition-property",
"227": "translate", "227": "transition-timing-function",
"228": "unicode-bidi", "228": "translate",
"229": "user-select", "229": "unicode-bidi",
"230": "vertical-align", "230": "user-select",
"231": "view-transition-name", "231": "vertical-align",
"232": "width", "232": "view-transition-name",
"233": "x", "233": "width",
"234": "y", "234": "x",
"235": "z-index" "235": "y",
"236": "z-index"
} }
All properties associated with document.body.style by default: All properties associated with document.body.style by default:
{} {}

View file

@ -615,6 +615,8 @@ All supported properties and their default values exposed from CSSStylePropertie
'text-shadow': 'none' 'text-shadow': 'none'
'textTransform': 'none' 'textTransform': 'none'
'text-transform': 'none' 'text-transform': 'none'
'textWrapMode': 'wrap'
'text-wrap-mode': 'wrap'
'top': 'auto' 'top': 'auto'
'touchAction': 'auto' 'touchAction': 'auto'
'touch-action': 'auto' 'touch-action': 'auto'

View file

@ -54,6 +54,7 @@ text-indent: 0px
text-justify: auto text-justify: auto
text-shadow: none text-shadow: none
text-transform: none text-transform: none
text-wrap-mode: wrap
visibility: visible visibility: visible
white-space: normal white-space: normal
white-space-collapse: collapse white-space-collapse: collapse
@ -85,7 +86,7 @@ background-position-x: 0%
background-position-y: 0% background-position-y: 0%
background-repeat: repeat background-repeat: repeat
background-size: auto auto background-size: auto auto
block-size: 1305px block-size: 1320px
border-block-end-color: rgb(0, 0, 0) border-block-end-color: rgb(0, 0, 0)
border-block-end-style: none border-block-end-style: none
border-block-end-width: medium border-block-end-width: medium
@ -150,7 +151,7 @@ grid-row-start: auto
grid-template-areas: none grid-template-areas: none
grid-template-columns: none grid-template-columns: none
grid-template-rows: none grid-template-rows: none
height: 2280px height: 2295px
inline-size: 784px inline-size: 784px
inset-block-end: auto inset-block-end: auto
inset-block-start: auto inset-block-start: auto

View file

@ -0,0 +1,7 @@
Harness status: OK
Found 2 tests
2 Pass
Pass Property text-wrap-mode value 'wrap'
Pass Property text-wrap-mode value 'nowrap'

View file

@ -0,0 +1,23 @@
Harness status: OK
Found 18 tests
18 Pass
Pass e.style['text-wrap-mode'] = "auto" should not set the property value
Pass e.style['text-wrap-mode'] = "normal" should not set the property value
Pass e.style['text-wrap-mode'] = "none" should not set the property value
Pass e.style['text-wrap-mode'] = "balance" should not set the property value
Pass e.style['text-wrap-mode'] = "pretty" should not set the property value
Pass e.style['text-wrap-mode'] = "stable" should not set the property value
Pass e.style['text-wrap-mode'] = "wrap stable" should not set the property value
Pass e.style['text-wrap-mode'] = "nowrap stable" should not set the property value
Pass e.style['text-wrap-mode'] = "wrap auto" should not set the property value
Pass e.style['text-wrap-mode'] = "balance balance" should not set the property value
Pass e.style['text-wrap-mode'] = "pretty pretty" should not set the property value
Pass e.style['text-wrap-mode'] = "stable stable" should not set the property value
Pass e.style['text-wrap-mode'] = "wrap nowrap" should not set the property value
Pass e.style['text-wrap-mode'] = "pretty balance" should not set the property value
Pass e.style['text-wrap-mode'] = "balance stable" should not set the property value
Pass e.style['text-wrap-mode'] = "stable pretty" should not set the property value
Pass e.style['text-wrap-mode'] = "delicious wrap" should not set the property value
Pass e.style['text-wrap-mode'] = "5px" should not set the property value

View file

@ -0,0 +1,12 @@
Harness status: OK
Found 7 tests
7 Pass
Pass e.style['text-wrap-mode'] = "wrap" should set the property value
Pass e.style['text-wrap-mode'] = "nowrap" should set the property value
Pass e.style['text-wrap-mode'] = "initial" should set the property value
Pass e.style['text-wrap-mode'] = "inherit" should set the property value
Pass e.style['text-wrap-mode'] = "unset" should set the property value
Pass e.style['text-wrap-mode'] = "revert" should set the property value
Pass e.style['text-wrap-mode'] = "revert-layer" should set the property value

View file

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedStyle().textWrapMode</title>
<link rel="author" title="Tim Nguyen" href="https://github.com/nt1m">
<link rel="help" href="https://drafts.csswg.org/css-text-4/#text-wrap-mode">
<meta name="assert" content="text-wrap-mode computed value is wrap | nowrap">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("text-wrap-mode", "wrap");
test_computed_value("text-wrap-mode", "nowrap");
</script>
</body>
</html>

View file

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text Module Test: parsing text-wrap-mode with invalid values</title>
<link rel="author" title="Tim Nguyen" href="https://github.com/nt1m">
<link rel="help" href="https://drafts.csswg.org/css-text-4/#text-wrap-mode">
<meta name="assert" content="text-wrap-mode supports only the grammar '<text-wrap-mode>'.">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("text-wrap-mode", "auto");
test_invalid_value("text-wrap-mode", "normal");
test_invalid_value("text-wrap-mode", "none");
test_invalid_value("text-wrap-mode", "balance");
test_invalid_value("text-wrap-mode", "pretty");
test_invalid_value("text-wrap-mode", "stable");
test_invalid_value("text-wrap-mode", "wrap stable");
test_invalid_value("text-wrap-mode", "nowrap stable");
test_invalid_value("text-wrap-mode", "wrap auto");
test_invalid_value("text-wrap-mode", "balance balance");
test_invalid_value("text-wrap-mode", "pretty pretty");
test_invalid_value("text-wrap-mode", "stable stable");
test_invalid_value("text-wrap-mode", "wrap nowrap");
test_invalid_value("text-wrap-mode", "pretty balance");
test_invalid_value("text-wrap-mode", "balance stable");
test_invalid_value("text-wrap-mode", "stable pretty");
test_invalid_value("text-wrap-mode", "delicious wrap");
test_invalid_value("text-wrap-mode", "5px");
</script>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text Module Test: parsing text-wrap-mode with valid values</title>
<link rel="author" title="Tim Nguyen" href="https://github.com/nt1m">
<link rel="help" href="https://drafts.csswg.org/css-text-4/#text-wrap-mode">
<meta name="assert" content="text-wrap-mode supports the full grammar.">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("text-wrap-mode", "wrap");
test_valid_value("text-wrap-mode", "nowrap");
test_valid_value("text-wrap-mode", "initial");
test_valid_value("text-wrap-mode", "inherit");
test_valid_value("text-wrap-mode", "unset");
test_valid_value("text-wrap-mode", "revert");
test_valid_value("text-wrap-mode", "revert-layer");
</script>
</body>
</html>