Tag Archives: JavaScript

The target=”_blank” phishing attack vector

If you use target=”_blank” you need to also use rel=”noopener noreferrer”

 

Ben Halpern writes:

If you use the target=”_blank” attribute on a link, and do not accompany it with a rel=”noopener” attribute, you are leaving your users open to a very simple phishing attack.

When a website uses target=”_blank” on their links in order to open a new tab or window, that website gives the new page access to the existing window through the window.opener API, allowing it a few permissions. Some of these permissions are automatically negated by cross-domain restrictions, but window.location is fair game.

In order to restrict the behavior window.opener access, the original page needs to add a rel=”noopener” attribute to any link that has target=”_blank”. However, Firefox does not support that tag, so you should actually use rel=”noopener noreferrer” for full coverage. Some amount of prevention can be acheived through scripting, though, as observed with Twitter, this seems to fail on Safari.

Read more from The Practical Developer

The Search For The Holy Grail: How I Ended Up With Element Queries, And How You Can Use Them Today – Smashing Magazine

EQCSS, an experiment in extending CSS with Element Queries, a way to apply styles based on element-specific conditions

 

For some time, we’ve run up against the limits of what CSS can do. Those who build responsive layouts will freely admit the frustrations and shortcomings of CSS that force us to reach for CSS preprocessors, plugins and other tools to help us write the styles that we’re unable to write with CSS alone. Even still, we run into limitations with what current tools help us accomplish. Think for a moment of a physical structure. If you’re building a large edifice with weak material, a lot of external support is required to hold it together, and things have to be overbuilt to stay sturdy. When you’re building a website out of HTML, CSS and JavaScript, this external support might look like frameworks, plugins, preprocessors, transpilers, editing tools, package managers and build processes.

Read more from the source: Smashing Magazine

Previewing ES6 Modules and more from ES2015, ES2016 and beyond

MS Edge adds ES6 features including import and export

 

Most of ES2015 (aka ES6) language support is already available in Edge, and last week’s Windows Insider Preview build 14342 brings more ES6 capabilities including modules, default parameters, and destructuring. We’re not stopping there – Edge also supports all ES2016 (aka ES7) proposals – the exponentiation operator and Array.prototype.includes – as well as future ECMAScript proposals such as Async Functions and utility methods like Object.values/entries and String.prototype.padStart/padEnd.

Read more from the source: Microsoft Edge Dev Blog

WebKit stops prefixing

WebKit ends its use of prefixes following Microsoft’s decision to make Edge support WebKit prefixes

 

WebKit’s new feature policy is to implement experimental features unprefixed, behind a runtime flag.

We’ll be evaluating existing features on a case-by-case basis. We expect to significantly reduce the number of prefixed properties supported over time but Web compatibility will require us to keep around prefixed versions of some features.

Read the announcement at WebKit