mirror of
https://github.com/beautifier/js-beautify.git
synced 2025-02-25 07:40:49 +00:00
Liam Newman
parent
f8abc1561d
commit
8c3ddc5c64
@ -1774,8 +1774,9 @@
|
||||
match = xmlRegExp.exec(xmlStr);
|
||||
}
|
||||
var xmlLength = match ? match.index + match[0].length : xmlStr.length;
|
||||
xmlStr = xmlStr.slice(0, xmlLength);
|
||||
parser_pos += xmlLength - 1;
|
||||
return [xmlStr.slice(0, xmlLength), "TK_STRING"];
|
||||
return [xmlStr, "TK_STRING"];
|
||||
}
|
||||
} else {
|
||||
//
|
||||
|
||||
@ -350,8 +350,8 @@ function run_javascript_tests(test_obj, Urlencoded, js_beautify, html_beautify,
|
||||
' </li>\n' +
|
||||
' );\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'\n' +
|
||||
'});');
|
||||
bt(
|
||||
'var List = React.createClass({\n' +
|
||||
' renderList: function() {\n' +
|
||||
' return this.props.items.map(function(item) {\n' +
|
||||
@ -364,15 +364,16 @@ function run_javascript_tests(test_obj, Urlencoded, js_beautify, html_beautify,
|
||||
' this.renderList()\n' +
|
||||
' </ul>\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'});');
|
||||
bt(
|
||||
'var Mist = React.createClass({\n' +
|
||||
' renderList: function() {\n' +
|
||||
' return this.props.items.map(function(item) {\n' +
|
||||
' return <ListItem item={return <tag>{item}</tag>} key={item.id} />;\n' +
|
||||
' });\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'\n' +
|
||||
'});');
|
||||
bt(
|
||||
'// JSX\n' +
|
||||
'var box = <Box>\n' +
|
||||
' {shouldShowAnswer(user) ?\n' +
|
||||
@ -390,6 +391,164 @@ function run_javascript_tests(test_obj, Urlencoded, js_beautify, html_beautify,
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'React.render(<HelloMessage name="John" />, mountNode);');
|
||||
bt(
|
||||
'var Timer = React.createClass({\n' +
|
||||
' getInitialState: function() {\n' +
|
||||
' return {\n' +
|
||||
' secondsElapsed: 0\n' +
|
||||
' };\n' +
|
||||
' },\n' +
|
||||
' tick: function() {\n' +
|
||||
' this.setState({\n' +
|
||||
' secondsElapsed: this.state.secondsElapsed + 1\n' +
|
||||
' });\n' +
|
||||
' },\n' +
|
||||
' componentDidMount: function() {\n' +
|
||||
' this.interval = setInterval(this.tick, 1000);\n' +
|
||||
' },\n' +
|
||||
' componentWillUnmount: function() {\n' +
|
||||
' clearInterval(this.interval);\n' +
|
||||
' },\n' +
|
||||
' render: function() {\n' +
|
||||
' return (\n' +
|
||||
' <div>Seconds Elapsed: {this.state.secondsElapsed}</div>\n' +
|
||||
' );\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'React.render(<Timer />, mountNode);');
|
||||
bt(
|
||||
'var TodoList = React.createClass({\n' +
|
||||
' render: function() {\n' +
|
||||
' var createItem = function(itemText) {\n' +
|
||||
' return <li>{itemText}</li>;\n' +
|
||||
' };\n' +
|
||||
' return <ul>{this.props.items.map(createItem)}</ul>;\n' +
|
||||
' }\n' +
|
||||
'});');
|
||||
bt(
|
||||
'var TodoApp = React.createClass({\n' +
|
||||
' getInitialState: function() {\n' +
|
||||
' return {\n' +
|
||||
' items: [],\n' +
|
||||
' text: \'\'\n' +
|
||||
' };\n' +
|
||||
' },\n' +
|
||||
' onChange: function(e) {\n' +
|
||||
' this.setState({\n' +
|
||||
' text: e.target.value\n' +
|
||||
' });\n' +
|
||||
' },\n' +
|
||||
' handleSubmit: function(e) {\n' +
|
||||
' e.preventDefault();\n' +
|
||||
' var nextItems = this.state.items.concat([this.state.text]);\n' +
|
||||
' var nextText = \'\';\n' +
|
||||
' this.setState({\n' +
|
||||
' items: nextItems,\n' +
|
||||
' text: nextText\n' +
|
||||
' });\n' +
|
||||
' },\n' +
|
||||
' render: function() {\n' +
|
||||
' return (\n' +
|
||||
' <div>\n' +
|
||||
' <h3>TODO</h3>\n' +
|
||||
' <TodoList items={this.state.items} />\n' +
|
||||
' <form onSubmit={this.handleSubmit}>\n' +
|
||||
' <input onChange={this.onChange} value={this.state.text} />\n' +
|
||||
' <button>{\'Add #\' + (this.state.items.length + 1)}</button>\n' +
|
||||
' </form>\n' +
|
||||
' </div>\n' +
|
||||
' );\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'React.render(<TodoApp />, mountNode);');
|
||||
bt(
|
||||
'var converter = new Showdown.converter();\n' +
|
||||
'var MarkdownEditor = React.createClass({\n' +
|
||||
' getInitialState: function() {\n' +
|
||||
' return {value: \'Type some *markdown* here!\'};\n' +
|
||||
' },\n' +
|
||||
' handleChange: function() {\n' +
|
||||
' this.setState({value: this.refs.textarea.getDOMNode().value});\n' +
|
||||
' },\n' +
|
||||
' render: function() {\n' +
|
||||
' return (\n' +
|
||||
' <div className="MarkdownEditor">\n' +
|
||||
' <h3>Input</h3>\n' +
|
||||
' <textarea\n' +
|
||||
' onChange={this.handleChange}\n' +
|
||||
' ref="textarea"\n' +
|
||||
' defaultValue={this.state.value} />\n' +
|
||||
' <h3>Output</h3>\n' +
|
||||
' <div\n' +
|
||||
' className="content"\n' +
|
||||
' dangerouslySetInnerHTML=\n' +
|
||||
' />\n' +
|
||||
' </div>\n' +
|
||||
' );\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'React.render(<MarkdownEditor />, mountNode);',
|
||||
'var converter = new Showdown.converter();\n' +
|
||||
'var MarkdownEditor = React.createClass({\n' +
|
||||
' getInitialState: function() {\n' +
|
||||
' return {\n' +
|
||||
' value: \'Type some *markdown* here!\'\n' +
|
||||
' };\n' +
|
||||
' },\n' +
|
||||
' handleChange: function() {\n' +
|
||||
' this.setState({\n' +
|
||||
' value: this.refs.textarea.getDOMNode().value\n' +
|
||||
' });\n' +
|
||||
' },\n' +
|
||||
' render: function() {\n' +
|
||||
' return (\n' +
|
||||
' <div className="MarkdownEditor">\n' +
|
||||
' <h3>Input</h3>\n' +
|
||||
' <textarea\n' +
|
||||
' onChange={this.handleChange}\n' +
|
||||
' ref="textarea"\n' +
|
||||
' defaultValue={this.state.value} />\n' +
|
||||
' <h3>Output</h3>\n' +
|
||||
' <div\n' +
|
||||
' className="content"\n' +
|
||||
' dangerouslySetInnerHTML=\n' +
|
||||
' />\n' +
|
||||
' </div>\n' +
|
||||
' );\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'React.render(<MarkdownEditor />, mountNode);');
|
||||
|
||||
// JSX - Not quite correct jsx formatting that still works
|
||||
bt(
|
||||
'var content = (\n' +
|
||||
' <Nav>\n' +
|
||||
' {/* child comment, put {} around */}\n' +
|
||||
' <Person\n' +
|
||||
' /* multi\n' +
|
||||
' line\n' +
|
||||
' comment */\n' +
|
||||
' //attr="test"\n' +
|
||||
' name={window.isLoggedIn ? window.name : \'\'} // end of line comment\n' +
|
||||
' />\n' +
|
||||
' </Nav>\n' +
|
||||
' );\n' +
|
||||
'var qwer = <DropDown> A dropdown list <Menu> <MenuItem>Do Something</MenuItem> <MenuItem>Do Something Fun!</MenuItem> <MenuItem>Do Something Else</MenuItem> </Menu> </DropDown>;\n' +
|
||||
'render(dropdown);',
|
||||
'var content = (\n' +
|
||||
' <Nav>\n' +
|
||||
' {/* child comment, put {} around */}\n' +
|
||||
' <Person\n' +
|
||||
' /* multi\n' +
|
||||
' line\n' +
|
||||
' comment */\n' +
|
||||
' //attr="test"\n' +
|
||||
' name={window.isLoggedIn ? window.name : \'\'} // end of line comment\n' +
|
||||
' />\n' +
|
||||
' </Nav>\n' +
|
||||
');\n' +
|
||||
'var qwer = <DropDown> A dropdown list <Menu> <MenuItem>Do Something</MenuItem> <MenuItem>Do Something Fun!</MenuItem> <MenuItem>Do Something Else</MenuItem> </Menu> </DropDown>;\n' +
|
||||
'render(dropdown);');
|
||||
|
||||
// Handles messed up tags, as long as it isn't the same name
|
||||
// as the root tag. Also handles tags of same name as root tag
|
||||
|
||||
@ -161,8 +161,8 @@ class TestJSBeautifier(unittest.TestCase):
|
||||
' </li>\n' +
|
||||
' );\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'\n' +
|
||||
'});')
|
||||
bt(
|
||||
'var List = React.createClass({\n' +
|
||||
' renderList: function() {\n' +
|
||||
' return this.props.items.map(function(item) {\n' +
|
||||
@ -175,15 +175,16 @@ class TestJSBeautifier(unittest.TestCase):
|
||||
' this.renderList()\n' +
|
||||
' </ul>\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'});')
|
||||
bt(
|
||||
'var Mist = React.createClass({\n' +
|
||||
' renderList: function() {\n' +
|
||||
' return this.props.items.map(function(item) {\n' +
|
||||
' return <ListItem item={return <tag>{item}</tag>} key={item.id} />;\n' +
|
||||
' });\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'\n' +
|
||||
'});')
|
||||
bt(
|
||||
'// JSX\n' +
|
||||
'var box = <Box>\n' +
|
||||
' {shouldShowAnswer(user) ?\n' +
|
||||
@ -201,6 +202,164 @@ class TestJSBeautifier(unittest.TestCase):
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'React.render(<HelloMessage name="John" />, mountNode);')
|
||||
bt(
|
||||
'var Timer = React.createClass({\n' +
|
||||
' getInitialState: function() {\n' +
|
||||
' return {\n' +
|
||||
' secondsElapsed: 0\n' +
|
||||
' };\n' +
|
||||
' },\n' +
|
||||
' tick: function() {\n' +
|
||||
' this.setState({\n' +
|
||||
' secondsElapsed: this.state.secondsElapsed + 1\n' +
|
||||
' });\n' +
|
||||
' },\n' +
|
||||
' componentDidMount: function() {\n' +
|
||||
' this.interval = setInterval(this.tick, 1000);\n' +
|
||||
' },\n' +
|
||||
' componentWillUnmount: function() {\n' +
|
||||
' clearInterval(this.interval);\n' +
|
||||
' },\n' +
|
||||
' render: function() {\n' +
|
||||
' return (\n' +
|
||||
' <div>Seconds Elapsed: {this.state.secondsElapsed}</div>\n' +
|
||||
' );\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'React.render(<Timer />, mountNode);')
|
||||
bt(
|
||||
'var TodoList = React.createClass({\n' +
|
||||
' render: function() {\n' +
|
||||
' var createItem = function(itemText) {\n' +
|
||||
' return <li>{itemText}</li>;\n' +
|
||||
' };\n' +
|
||||
' return <ul>{this.props.items.map(createItem)}</ul>;\n' +
|
||||
' }\n' +
|
||||
'});')
|
||||
bt(
|
||||
'var TodoApp = React.createClass({\n' +
|
||||
' getInitialState: function() {\n' +
|
||||
' return {\n' +
|
||||
' items: [],\n' +
|
||||
' text: \'\'\n' +
|
||||
' };\n' +
|
||||
' },\n' +
|
||||
' onChange: function(e) {\n' +
|
||||
' this.setState({\n' +
|
||||
' text: e.target.value\n' +
|
||||
' });\n' +
|
||||
' },\n' +
|
||||
' handleSubmit: function(e) {\n' +
|
||||
' e.preventDefault();\n' +
|
||||
' var nextItems = this.state.items.concat([this.state.text]);\n' +
|
||||
' var nextText = \'\';\n' +
|
||||
' this.setState({\n' +
|
||||
' items: nextItems,\n' +
|
||||
' text: nextText\n' +
|
||||
' });\n' +
|
||||
' },\n' +
|
||||
' render: function() {\n' +
|
||||
' return (\n' +
|
||||
' <div>\n' +
|
||||
' <h3>TODO</h3>\n' +
|
||||
' <TodoList items={this.state.items} />\n' +
|
||||
' <form onSubmit={this.handleSubmit}>\n' +
|
||||
' <input onChange={this.onChange} value={this.state.text} />\n' +
|
||||
' <button>{\'Add #\' + (this.state.items.length + 1)}</button>\n' +
|
||||
' </form>\n' +
|
||||
' </div>\n' +
|
||||
' );\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'React.render(<TodoApp />, mountNode);')
|
||||
bt(
|
||||
'var converter = new Showdown.converter();\n' +
|
||||
'var MarkdownEditor = React.createClass({\n' +
|
||||
' getInitialState: function() {\n' +
|
||||
' return {value: \'Type some *markdown* here!\'};\n' +
|
||||
' },\n' +
|
||||
' handleChange: function() {\n' +
|
||||
' this.setState({value: this.refs.textarea.getDOMNode().value});\n' +
|
||||
' },\n' +
|
||||
' render: function() {\n' +
|
||||
' return (\n' +
|
||||
' <div className="MarkdownEditor">\n' +
|
||||
' <h3>Input</h3>\n' +
|
||||
' <textarea\n' +
|
||||
' onChange={this.handleChange}\n' +
|
||||
' ref="textarea"\n' +
|
||||
' defaultValue={this.state.value} />\n' +
|
||||
' <h3>Output</h3>\n' +
|
||||
' <div\n' +
|
||||
' className="content"\n' +
|
||||
' dangerouslySetInnerHTML=\n' +
|
||||
' />\n' +
|
||||
' </div>\n' +
|
||||
' );\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'React.render(<MarkdownEditor />, mountNode);',
|
||||
'var converter = new Showdown.converter();\n' +
|
||||
'var MarkdownEditor = React.createClass({\n' +
|
||||
' getInitialState: function() {\n' +
|
||||
' return {\n' +
|
||||
' value: \'Type some *markdown* here!\'\n' +
|
||||
' };\n' +
|
||||
' },\n' +
|
||||
' handleChange: function() {\n' +
|
||||
' this.setState({\n' +
|
||||
' value: this.refs.textarea.getDOMNode().value\n' +
|
||||
' });\n' +
|
||||
' },\n' +
|
||||
' render: function() {\n' +
|
||||
' return (\n' +
|
||||
' <div className="MarkdownEditor">\n' +
|
||||
' <h3>Input</h3>\n' +
|
||||
' <textarea\n' +
|
||||
' onChange={this.handleChange}\n' +
|
||||
' ref="textarea"\n' +
|
||||
' defaultValue={this.state.value} />\n' +
|
||||
' <h3>Output</h3>\n' +
|
||||
' <div\n' +
|
||||
' className="content"\n' +
|
||||
' dangerouslySetInnerHTML=\n' +
|
||||
' />\n' +
|
||||
' </div>\n' +
|
||||
' );\n' +
|
||||
' }\n' +
|
||||
'});\n' +
|
||||
'React.render(<MarkdownEditor />, mountNode);')
|
||||
|
||||
# JSX - Not quite correct jsx formatting that still works
|
||||
bt(
|
||||
'var content = (\n' +
|
||||
' <Nav>\n' +
|
||||
' {/* child comment, put {} around */}\n' +
|
||||
' <Person\n' +
|
||||
' /* multi\n' +
|
||||
' line\n' +
|
||||
' comment */\n' +
|
||||
' //attr="test"\n' +
|
||||
' name={window.isLoggedIn ? window.name : \'\'} // end of line comment\n' +
|
||||
' />\n' +
|
||||
' </Nav>\n' +
|
||||
' );\n' +
|
||||
'var qwer = <DropDown> A dropdown list <Menu> <MenuItem>Do Something</MenuItem> <MenuItem>Do Something Fun!</MenuItem> <MenuItem>Do Something Else</MenuItem> </Menu> </DropDown>;\n' +
|
||||
'render(dropdown);',
|
||||
'var content = (\n' +
|
||||
' <Nav>\n' +
|
||||
' {/* child comment, put {} around */}\n' +
|
||||
' <Person\n' +
|
||||
' /* multi\n' +
|
||||
' line\n' +
|
||||
' comment */\n' +
|
||||
' //attr="test"\n' +
|
||||
' name={window.isLoggedIn ? window.name : \'\'} // end of line comment\n' +
|
||||
' />\n' +
|
||||
' </Nav>\n' +
|
||||
');\n' +
|
||||
'var qwer = <DropDown> A dropdown list <Menu> <MenuItem>Do Something</MenuItem> <MenuItem>Do Something Fun!</MenuItem> <MenuItem>Do Something Else</MenuItem> </Menu> </DropDown>;\n' +
|
||||
'render(dropdown);')
|
||||
|
||||
# Handles messed up tags, as long as it isn't the same name
|
||||
# as the root tag. Also handles tags of same name as root tag
|
||||
|
||||
@ -162,8 +162,12 @@ exports.test_data = {
|
||||
' </li>',
|
||||
' );',
|
||||
' }',
|
||||
'});',
|
||||
'',
|
||||
'});'
|
||||
]
|
||||
},
|
||||
{
|
||||
unchanged:
|
||||
[
|
||||
'var List = React.createClass({',
|
||||
' renderList: function() {',
|
||||
' return this.props.items.map(function(item) {',
|
||||
@ -176,7 +180,12 @@ exports.test_data = {
|
||||
' this.renderList()',
|
||||
' </ul>',
|
||||
' }',
|
||||
'});',
|
||||
'});'
|
||||
]
|
||||
},
|
||||
{
|
||||
unchanged:
|
||||
[
|
||||
'var Mist = React.createClass({',
|
||||
' renderList: function() {',
|
||||
' return this.props.items.map(function(item) {',
|
||||
@ -184,7 +193,11 @@ exports.test_data = {
|
||||
' });',
|
||||
' }',
|
||||
'});',
|
||||
'',
|
||||
]
|
||||
},
|
||||
{
|
||||
unchanged:
|
||||
[
|
||||
'// JSX',
|
||||
'var box = <Box>',
|
||||
' {shouldShowAnswer(user) ?',
|
||||
@ -202,160 +215,196 @@ exports.test_data = {
|
||||
' }',
|
||||
'});',
|
||||
'React.render(<HelloMessage name="John" />, mountNode);',
|
||||
// '',
|
||||
// '',
|
||||
// 'var Timer = React.createClass({',
|
||||
// ' getInitialState: function() {',
|
||||
// ' return {secondsElapsed: 0};',
|
||||
// ' },',
|
||||
// ' tick: function() {',
|
||||
// ' this.setState({secondsElapsed: this.state.secondsElapsed + 1});',
|
||||
// ' },',
|
||||
// ' componentDidMount: function() {',
|
||||
// ' this.interval = setInterval(this.tick, 1000);',
|
||||
// ' },',
|
||||
// ' componentWillUnmount: function() {',
|
||||
// ' clearInterval(this.interval);',
|
||||
// ' },',
|
||||
// ' render: function() {',
|
||||
// ' return (',
|
||||
// ' <div>Seconds Elapsed: {this.state.secondsElapsed}</div>',
|
||||
// ' );',
|
||||
// ' }',
|
||||
// '});',
|
||||
// 'React.render(<Timer />, mountNode);',
|
||||
// '',
|
||||
// '',
|
||||
// 'var Timer = React.createClass({',
|
||||
// ' getInitialState: function() {',
|
||||
// ' return {secondsElapsed: 0};',
|
||||
// ' },',
|
||||
// ' tick: function() {',
|
||||
// ' this.setState({secondsElapsed: this.state.secondsElapsed + 1});',
|
||||
// ' },',
|
||||
// ' componentDidMount: function() {',
|
||||
// ' this.interval = setInterval(this.tick, 1000);',
|
||||
// ' },',
|
||||
// ' componentWillUnmount: function() {',
|
||||
// ' clearInterval(this.interval);',
|
||||
// ' },',
|
||||
// ' render: function() {',
|
||||
// ' return (',
|
||||
// ' <div>Seconds Elapsed: {this.state.secondsElapsed}</div>',
|
||||
// ' );',
|
||||
// ' }',
|
||||
// '});',
|
||||
// 'React.render(<Timer />, mountNode);',
|
||||
// '',
|
||||
// '',
|
||||
// 'var TodoList = React.createClass({',
|
||||
// ' render: function() {',
|
||||
// ' var createItem = function(itemText) {',
|
||||
// ' return <li>{itemText}</li>;',
|
||||
// ' };',
|
||||
// ' return <ul>{this.props.items.map(createItem)}</ul>;',
|
||||
// ' }',
|
||||
// '});',
|
||||
// 'var TodoApp = React.createClass({',
|
||||
// ' getInitialState: function() {',
|
||||
// ' return {items: [], text: \\\'\\\'};',
|
||||
// ' },',
|
||||
// ' onChange: function(e) {',
|
||||
// ' this.setState({text: e.target.value});',
|
||||
// ' },',
|
||||
// ' handleSubmit: function(e) {',
|
||||
// ' e.preventDefault();',
|
||||
// ' var nextItems = this.state.items.concat([this.state.text]);',
|
||||
// ' var nextText = \\\'\\\';',
|
||||
// ' this.setState({items: nextItems, text: nextText});',
|
||||
// ' },',
|
||||
// ' render: function() {',
|
||||
// ' return (',
|
||||
// ' <div>',
|
||||
// ' <h3>TODO</h3>',
|
||||
// ' <TodoList items={this.state.items} />',
|
||||
// ' <form onSubmit={this.handleSubmit}>',
|
||||
// ' <input onChange={this.onChange} value={this.state.text} />',
|
||||
// ' <button>{\\\'Add #\\\' + (this.state.items.length + 1)}</button>',
|
||||
// ' </form>',
|
||||
// ' </div>',
|
||||
// ' );',
|
||||
// ' }',
|
||||
// '});',
|
||||
// 'React.render(<TodoApp />, mountNode);',
|
||||
// '',
|
||||
// '',
|
||||
// 'var converter = new Showdown.converter();',
|
||||
// 'var MarkdownEditor = React.createClass({',
|
||||
// ' getInitialState: function() {',
|
||||
// ' return {value: \\\'Type some *markdown* here!\\\'};',
|
||||
// ' },',
|
||||
// ' handleChange: function() {',
|
||||
// ' this.setState({value: this.refs.textarea.getDOMNode().value});',
|
||||
// ' },',
|
||||
// ' render: function() {',
|
||||
// ' return (',
|
||||
// ' <div className="MarkdownEditor">',
|
||||
// ' <h3>Input</h3>',
|
||||
// ' <textarea',
|
||||
// ' onChange={this.handleChange}',
|
||||
// ' ref="textarea"',
|
||||
// ' defaultValue={this.state.value} />',
|
||||
// ' <h3>Output</h3>',
|
||||
// ' <div',
|
||||
// ' className="content"',
|
||||
// ' dangerouslySetInnerHTML={{',
|
||||
// ' __html: converter.makeHtml(this.state.value)',
|
||||
// ' }}',
|
||||
// ' />',
|
||||
// ' </div>',
|
||||
// ' );',
|
||||
// ' }',
|
||||
// '});',
|
||||
// 'React.render(<MarkdownEditor />, mountNode);'
|
||||
],
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
unchanged:
|
||||
[
|
||||
'var Timer = React.createClass({',
|
||||
' getInitialState: function() {',
|
||||
' return {',
|
||||
' secondsElapsed: 0',
|
||||
' };',
|
||||
' },',
|
||||
' tick: function() {',
|
||||
' this.setState({',
|
||||
' secondsElapsed: this.state.secondsElapsed + 1',
|
||||
' });',
|
||||
' },',
|
||||
' componentDidMount: function() {',
|
||||
' this.interval = setInterval(this.tick, 1000);',
|
||||
' },',
|
||||
' componentWillUnmount: function() {',
|
||||
' clearInterval(this.interval);',
|
||||
' },',
|
||||
' render: function() {',
|
||||
' return (',
|
||||
' <div>Seconds Elapsed: {this.state.secondsElapsed}</div>',
|
||||
' );',
|
||||
' }',
|
||||
'});',
|
||||
'React.render(<Timer />, mountNode);'
|
||||
]
|
||||
},
|
||||
{
|
||||
unchanged:
|
||||
[
|
||||
'var TodoList = React.createClass({',
|
||||
' render: function() {',
|
||||
' var createItem = function(itemText) {',
|
||||
' return <li>{itemText}</li>;',
|
||||
' };',
|
||||
' return <ul>{this.props.items.map(createItem)}</ul>;',
|
||||
' }',
|
||||
'});'
|
||||
]
|
||||
},
|
||||
{
|
||||
unchanged:
|
||||
[
|
||||
'var TodoApp = React.createClass({',
|
||||
' getInitialState: function() {',
|
||||
' return {',
|
||||
' items: [],',
|
||||
' text: \\\'\\\'',
|
||||
' };',
|
||||
' },',
|
||||
' onChange: function(e) {',
|
||||
' this.setState({',
|
||||
' text: e.target.value',
|
||||
' });',
|
||||
' },',
|
||||
' handleSubmit: function(e) {',
|
||||
' e.preventDefault();',
|
||||
' var nextItems = this.state.items.concat([this.state.text]);',
|
||||
' var nextText = \\\'\\\';',
|
||||
' this.setState({',
|
||||
' items: nextItems,',
|
||||
' text: nextText',
|
||||
' });',
|
||||
' },',
|
||||
' render: function() {',
|
||||
' return (',
|
||||
' <div>',
|
||||
' <h3>TODO</h3>',
|
||||
' <TodoList items={this.state.items} />',
|
||||
' <form onSubmit={this.handleSubmit}>',
|
||||
' <input onChange={this.onChange} value={this.state.text} />',
|
||||
' <button>{\\\'Add #\\\' + (this.state.items.length + 1)}</button>',
|
||||
' </form>',
|
||||
' </div>',
|
||||
' );',
|
||||
' }',
|
||||
'});',
|
||||
'React.render(<TodoApp />, mountNode);'
|
||||
]
|
||||
},
|
||||
{
|
||||
input:
|
||||
[
|
||||
'var converter = new Showdown.converter();',
|
||||
'var MarkdownEditor = React.createClass({',
|
||||
' getInitialState: function() {',
|
||||
' return {value: \\\'Type some *markdown* here!\\\'};',
|
||||
' },',
|
||||
' handleChange: function() {',
|
||||
' this.setState({value: this.refs.textarea.getDOMNode().value});',
|
||||
' },',
|
||||
' render: function() {',
|
||||
' return (',
|
||||
' <div className="MarkdownEditor">',
|
||||
' <h3>Input</h3>',
|
||||
' <textarea',
|
||||
' onChange={this.handleChange}',
|
||||
' ref="textarea"',
|
||||
' defaultValue={this.state.value} />',
|
||||
' <h3>Output</h3>',
|
||||
' <div',
|
||||
' className="content"',
|
||||
' dangerouslySetInnerHTML={{',
|
||||
' __html: converter.makeHtml(this.state.value)',
|
||||
' }}',
|
||||
' />',
|
||||
' </div>',
|
||||
' );',
|
||||
' }',
|
||||
'});',
|
||||
'React.render(<MarkdownEditor />, mountNode);'
|
||||
|
||||
],
|
||||
output:
|
||||
[
|
||||
'var converter = new Showdown.converter();',
|
||||
'var MarkdownEditor = React.createClass({',
|
||||
' getInitialState: function() {',
|
||||
' return {',
|
||||
' value: \\\'Type some *markdown* here!\\\'',
|
||||
' };',
|
||||
' },',
|
||||
' handleChange: function() {',
|
||||
' this.setState({',
|
||||
' value: this.refs.textarea.getDOMNode().value',
|
||||
' });',
|
||||
' },',
|
||||
' render: function() {',
|
||||
' return (',
|
||||
' <div className="MarkdownEditor">',
|
||||
' <h3>Input</h3>',
|
||||
' <textarea',
|
||||
' onChange={this.handleChange}',
|
||||
' ref="textarea"',
|
||||
' defaultValue={this.state.value} />',
|
||||
' <h3>Output</h3>',
|
||||
' <div',
|
||||
' className="content"',
|
||||
' dangerouslySetInnerHTML={{',
|
||||
' __html: converter.makeHtml(this.state.value)',
|
||||
' }}',
|
||||
' />',
|
||||
' </div>',
|
||||
' );',
|
||||
' }',
|
||||
'});',
|
||||
'React.render(<MarkdownEditor />, mountNode);'
|
||||
]
|
||||
},
|
||||
{
|
||||
comment: 'JSX - Not quite correct jsx formatting that still works',
|
||||
input:
|
||||
[
|
||||
'var content = (',
|
||||
' <Nav>',
|
||||
' {/* child comment, put {} around */}',
|
||||
' <Person',
|
||||
' /* multi',
|
||||
' line',
|
||||
' comment */',
|
||||
' //attr="test"',
|
||||
' name={window.isLoggedIn ? window.name : \\\'\\\'} // end of line comment',
|
||||
' />',
|
||||
' </Nav>',
|
||||
' );',
|
||||
'var qwer = <DropDown> A dropdown list <Menu> <MenuItem>Do Something</MenuItem> <MenuItem>Do Something Fun!</MenuItem> <MenuItem>Do Something Else</MenuItem> </Menu> </DropDown>;',
|
||||
'render(dropdown);',
|
||||
],
|
||||
output:
|
||||
[
|
||||
'var content = (',
|
||||
' <Nav>',
|
||||
' {/* child comment, put {} around */}',
|
||||
' <Person',
|
||||
' /* multi',
|
||||
' line',
|
||||
' comment */',
|
||||
' //attr="test"',
|
||||
' name={window.isLoggedIn ? window.name : \\\'\\\'} // end of line comment',
|
||||
' />',
|
||||
' </Nav>',
|
||||
');',
|
||||
'var qwer = <DropDown> A dropdown list <Menu> <MenuItem>Do Something</MenuItem> <MenuItem>Do Something Fun!</MenuItem> <MenuItem>Do Something Else</MenuItem> </Menu> </DropDown>;',
|
||||
'render(dropdown);',
|
||||
]
|
||||
},
|
||||
// {
|
||||
// comment: 'JSX - Not quite correct jsx formatting that still works',
|
||||
// fragment: true,
|
||||
// input:
|
||||
// [
|
||||
// 'var content = (',
|
||||
// ' <Nav>',
|
||||
// ' {/* child comment, put {} around */}',
|
||||
// ' <Person',
|
||||
// ' /* multi',
|
||||
// ' line',
|
||||
// ' comment */',
|
||||
// ' //attr="test"',
|
||||
// ' name={window.isLoggedIn ? window.name : \\\'\\\'} // end of line comment',
|
||||
// ' />',
|
||||
// ' </Nav>',
|
||||
// ' );',
|
||||
// 'var qwer = <Dropdown> A dropdown list <Menu> <MenuItem>Do Something</MenuItem> <MenuItem>Do Something Fun!</MenuItem> <MenuItem>Do Something Else</MenuItem> </Menu> </DropDown>;',
|
||||
// 'render(dropdown);',
|
||||
// 'foo=bar;'
|
||||
// ],
|
||||
// output:
|
||||
// [
|
||||
// 'var content = (',
|
||||
// ' <Nav>',
|
||||
// ' {/* child comment, put {} around */}',
|
||||
// ' <Person',
|
||||
// ' /* multi',
|
||||
// ' line',
|
||||
// ' comment */',
|
||||
// ' //attr="test"',
|
||||
// ' name={window.isLoggedIn ? window.name : \\\'\\\'} // end of line comment',
|
||||
// ' />',
|
||||
// ' </Nav>',
|
||||
// ');',
|
||||
// 'var qwer = <Dropdown> A dropdown list <Menu> <MenuItem>Do Something</MenuItem> <MenuItem>Do Something Fun!</MenuItem> <MenuItem>Do Something Else</MenuItem> </Menu> </DropDown>;',
|
||||
// 'render(dropdown);',
|
||||
// 'foo = bar;'
|
||||
// ]
|
||||
// },
|
||||
{
|
||||
comment: [
|
||||
"Handles messed up tags, as long as it isn't the same name",
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user