end end end World(HtmlSelectorsHelpers) nth-of-type matches by counting the actual HTML-tag Using :nth-of-type like this, might not work as you expect, as...
...it only cares about the HTML-Tag type. Example. This might lead to breaking tests when your html changes. Once browser support is fulfilled prefiltering nth-child selector will be...
...user actually sees) puts page.text Prints just the visible text body, completely stripped of HTML tags and hidden elements. Raw HTML puts page.body Prints the full HTML so you can...
...inspect CSS classes, attributes, or missing elements. If HTML output is cluttered with excessive blank lines, you can easily avoid printing them: puts page.body.gsub(/^\s*$/, '').squeeze("\n") Advanced DOM parsing...
...cannot be achieved with the [inert] attribute. See also Preventing interactivity on elements using HTML or CSS Non-interactive Elements with the inert attribute
...HTML elements can automatically start playing when the autoplay attribute is set on them. Except for when they can not, e.g. on pageload, or when the element enters the DOM...
To return non-HTML responses (like XLS spreadsheets), we usually use the respond_to do |format| format.xls do # send spreadsheet end end This is often, but not always the same...
Today I learned that you can animate HTML elements using the Web Animation API's method .animate(keyframes, options) (which seems to be Baseline for all browsers since 2022).
Nokogiri is great. It will even fix invalid HTML for you, like a browser would (e.g. move block elements out of parents which are specified to not allow them).
...HTML.fragment(" foo bar ").to_s => " foo bar " While this is mostly useful, browsers are actually fine with a bit of badly formatted HTML. And you don't want to be...
When your Cucumber feature needs to browse the page HTML, and you are not sure how to express your query as a clever CSS or XPath expression, there is another...
You cannot use Array#join on an array of strings where some strings are html_safe and others are not. The result will be an unsafe string and will thus...
...be escaped when rendered in a view: unsafe_string = ' foo ' safe_string = ' bar '.html_safe [unsafe_string, safe_string].join(' ') # will incorrectly render as '<span>foo</span...
Web forms can be made much more usable with a few HTML attributes. Short summary: type: Tells browsers about the input data type. Mobile browsers will select a virtual keyboard...
...a subject block. You can also use describe to specify which parts of your html you are currently interested in naming it with it's actual selector. The context can...
Code snippet tested with Rails 2.3 def index # ... if request.xhr? html = render_to_string(:partial => "list", :layout => false) respond_to do |format| format.html { render :text => html } format.json { render :json => {:html...
...html,...
end end end Note: Perhaps you ran into ActionView::MissingTemplate error and this card might help. If you call render_to_string within the format.json block, Rails will only...
Make sure that you use the correct property when editing an HTML attribute. Using innerHTML with unsafe arguments...
...makes your application vulnerable to XSS. textContent: Sets the content of a Node (arguments are HTML-safe escaped) innerHTML: Sets the HTML of an Element (arguments are not escaped and...
While both the alt attribute and the figcaption element provide a way to describe images, the way we write for...
...chapters explain different approaches in Rails, how you can assign such an association via HTML forms. In most cases you want to use Option 4 with assignable values.
...chapters explain different approaches in Rails, how you can assign such an association via HTML forms. Option 1: Array column One way to solve the problem is using a database...
Besides their default styling properties, HTML elements have a semantic meaning. For example, an h1 tag is usually styled with a larger font and bold, while it denotes "the single...
...most important headline in its context". While CSS enables us to style almost any HTML element like anything that is needed, choosing HTML elements corresponding to the meaning of their...
...reconfiguring your Rails app so two requests to the same resource produce the same HTML for a given user...
capybara_element['attribute_name'] allows accessing an element's attributes in Capybara. A few examples: find('#my_element')['class']
Browsers can auto fill-in one time codes if advised. Use it like this: Demo: https://twitter.com/sulco/status/1320700982943223808 Browser support...
A comprehensive introduction to sending HTML emails. Intro: HTML email: Two words that, when combined, brings tears to a developer’s eyes. If you’re a web developer, it’s...
...lap at some time in your career, whether you like it or not. Coding HTML email is old school. Think back to 1999, when we called ourselves “webmasters” and used...
...keep your well-structured CSS files and do the inlining for you. See Designing HTML email Since Roadie is now in passive maintenance mode, we go with premailer: Include premailer...
...tag attachments['logo.png'].url, alt: 'Company logo', width: 100 %> Note: You should set the html width and/or height attribute as shown above, because most of the e-mail clients can...
...they want their tables back. Unfortunately, you need them all for laying out your HTML emails. Email client HTML rendering is way more scattered than browser HTML. While you might...
...can use to support all major browsers, I doubt anyone masters this craft for HTML email clients. The only way to ensure your email looks good (acceptable, at least) in...
...JavaScript, and put this into your application.js: $(function() { $('[data-remote][data-replace]') .data('type', 'html') .live('ajax:success', function(event, data) { var $this = $(this); $($this.data('replace')).html(data); $this.trigger('ajax...
...helper, use the following code instead: $.unobtrusive(function() { $('[data-remote][data-replace]') .data('type', 'html') .live('ajax:success', function(event, data) { var $this = $(this); $($this.data('replace')) .html(data) .activateUnobtrusiveJavascript(); $this.trigger...
...Chrome 65 with current Selenium-Webdriver (3.11) and chromedriver (2.37), where strings containing slashes (HTML) would be completely mangled...