1
0
Fork 0
mirror of https://github.com/teamcapybara/capybara.git synced 2022-11-09 12:08:07 -05:00
teamcapybara--capybara/lib/capybara/spec/views/react.erb
Eric Anderson f20c8de93c
Switch test file to standards mode
Goal
====

Many of the test files were not specifying a doctype. This means they
are operating in quirks mode which behaves differently than standards
mode. Most systems in production use today operate in some sort of
standards mode (most often HTML5).

There is a question on what modes Capybara should support. There is
quirks mode (no doctype), HTML4, HTML5, various XHTML formats (strict,
traditional, frameset). My suggestion is that we don't care about quirks
mode as it is a legacy format. If someone is using that they will need
to live with those consequences. For the other formats I'm going to
assume if it works in HTML5 it will work in the others. When that
assumption is shown to be false a bug can be filed and we can create a
specific test to cover that format for that scenario but I think running
basically every test in every doctype would add more complication to the
test suite than it is worth.

Implementation
==============

In general the idea is just to add the following to all the test HTML:

    <!DOCTYPE html>

This declares it a standardized HTML5 document following standards mode
rather than quirks mode.

Many of the templates not only lack a doctype but also lack other HTML
structure to be a valid HTML file (i.e. not html tag, head tag, body
tag, etc). Basically they are without a layout. I assume this is because
the test does not dependent a valid HTML file. But since we want to
run in standards mode I think we should add a layout to these files.
Rather than add boilerplate layout code to every file I'm instead using
the layout feature of Sinatra. If the template file already has a
doctype then just render it without the standard layout. Otherwise
render it with the standard layout.

There were a few files that indicated a XHTML namespace. Since we are
doing all HTML5 doctypes we do not need a XHTML namespace and therefore
those attributes were removed. I suspect these namespaces attriubtes
were just copy/paste boilerplate. The exception to this is the
`with_namespace.erb` template. This seems to be testing something
related to XHTML namespaces so I left it and instead added a XHTML
Strict doctype.

The `with_title` template I don't think is used since there is an
inline HTML doc on the Sinatra code with the same endpoint. I suspect
that is leftover from an old refactor so removed that file completely.

Test Failures
-------------

With these changes made we ended up with test failures related to scroll
(expected as that is what prompted this work) and frames. I will follow
up with additional commits to correct these failures. They are
currently:

rspec './lib/capybara/spec/spec_helper.rb[1:44:3]' # Capybara::Session selenium_chrome #frame_title should return the title in the main frame
rspec './lib/capybara/spec/spec_helper.rb[1:44:1]' # Capybara::Session selenium_chrome #frame_title should return the title in a frame
rspec './lib/capybara/spec/spec_helper.rb[1:44:2]' # Capybara::Session selenium_chrome #frame_title should return the title in FrameTwo
rspec './lib/capybara/spec/spec_helper.rb[1:98:5]' # Capybara::Session selenium_chrome #scroll_to can scroll the window to the vertical bottom
rspec './lib/capybara/spec/spec_helper.rb[1:98:3]' # Capybara::Session selenium_chrome #scroll_to can scroll an element to the center of the viewport
rspec './lib/capybara/spec/spec_helper.rb[1:98:2]' # Capybara::Session selenium_chrome #scroll_to can scroll an element to the bottom of the viewport
rspec './lib/capybara/spec/spec_helper.rb[1:98:6]' # Capybara::Session selenium_chrome #scroll_to can scroll the window to the vertical center
rspec './lib/capybara/spec/spec_helper.rb[1:98:7]' # Capybara::Session selenium_chrome #scroll_to can scroll the window to specific location
rspec './lib/capybara/spec/spec_helper.rb[1:98:15]' # Capybara::Session selenium_chrome #scroll_to can scroll the window by a specific amount
2021-07-22 12:39:58 -04:00

45 lines
1.3 KiB
Text

<!DOCTYPE html>
<html>
<head>
<script src="https://unpkg.com/react/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom/umd/react-dom.development.js"></script>
</head>
<body>
<div id="root"></div>
<script>
// https://codepen.io/gaearon/pen/VmmPgp?editors=0010
class NameForm extends React.Component {
constructor(props) {
super(props);
this.state = { value: '' };
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleChange(event) {
this.setState({ value: event.target.value });
}
handleSubmit(event) {
alert('A name was submitted: ' + this.state.value);
event.preventDefault();
}
render() {
return (
React.createElement("form", { onSubmit: this.handleSubmit },
React.createElement("label", null, "Name:",
React.createElement("input", { type: "text", value: this.state.value, onChange: this.handleChange })),
React.createElement("input", { type: "submit", value: "Submit" })));
}}
ReactDOM.render(
React.createElement(NameForm, null),
document.getElementById('root'));
</script>
</body>
</html>