Add feature detect for nth-child() #685

Merged
merged 18 commits into from Jul 1, 2013

Projects

None yet

6 participants

@emilchristensen
Contributor

Reference: http://reference.sitepoint.com/css/pseudoclass-nthchild

Tested to work in:
Internet Explorer 7 (false), 8 (false), 9 (true)
Chrome 7 (true), 21 (true)
Firefox 3.6 (true), 14 (true)
Safari 5.2 (true), 6 (true)
Opera 9.0 build 3447 (false), 12 (true)

Known issues in:
Safari 3.1, 3.2.2 (false negatives)

@sindresorhus sindresorhus commented on an outdated diff Sep 7, 2012
feature-detects/css-nthchild.js
@@ -0,0 +1,13 @@
+// nth-child pseudo selector
+Modernizr.addTest('nthchild', function(){
+
+ return Modernizr.testStyles("#modernizr div {width:1px} #modernizr div:nth-child(2n) {width:2px;}", function (elem) {
+ var elems = elem.getElementsByTagName("div"),
+ test = true;
+ for (i=0; i<5; i++) {
@sindresorhus
sindresorhus Sep 7, 2012 Member

You're leaking the i

@sindresorhus sindresorhus commented on an outdated diff Sep 7, 2012
feature-detects/css-nthchild.js
@@ -0,0 +1,13 @@
+// nth-child pseudo selector
+Modernizr.addTest('nthchild', function(){
+
+ return Modernizr.testStyles("#modernizr div {width:1px} #modernizr div:nth-child(2n) {width:2px;}", function (elem) {
@sindresorhus
sindresorhus Sep 7, 2012 Member

single-quotes

@sindresorhus sindresorhus commented on an outdated diff Sep 7, 2012
feature-detects/css-nthchild.js
@@ -0,0 +1,13 @@
+// nth-child pseudo selector
+Modernizr.addTest('nthchild', function(){
+
+ return Modernizr.testStyles("#modernizr div {width:1px} #modernizr div:nth-child(2n) {width:2px;}", function (elem) {
+ var elems = elem.getElementsByTagName("div"),
+ test = true;
@sindresorhus
Member

Please add a description to the PR about how the test works.

@sindresorhus sindresorhus commented on an outdated diff Jan 24, 2013
feature-detects/css-nthchild.js
@@ -0,0 +1,15 @@
+// nth-child pseudo selector
+Modernizr.addTest('nthchild', function(){
+
+ return Modernizr.testStyles('#modernizr div {width:1px} #modernizr div:nth-child(2n) {width:2px;}', function (elem) {
+ var elems = elem.getElementsByTagName('div'),
+ test = true;
+
+ for (var i=0; i<5; i++) {
@sindresorhus
sindresorhus Jan 24, 2013 Member

for (var i = 0; i < 5; i++) {

@sindresorhus sindresorhus commented on an outdated diff Jan 24, 2013
feature-detects/css-nthchild.js
@@ -0,0 +1,15 @@
+// nth-child pseudo selector
+Modernizr.addTest('nthchild', function(){
+
+ return Modernizr.testStyles('#modernizr div {width:1px} #modernizr div:nth-child(2n) {width:2px;}', function (elem) {
+ var elems = elem.getElementsByTagName('div'),
+ test = true;
+
+ for (var i=0; i<5; i++) {
+ test = test && elems[i].offsetWidth == i%2+1;
@sindresorhus
sindresorhus Jan 24, 2013 Member

=== i % 2 + 1

@sindresorhus sindresorhus commented on an outdated diff Jan 24, 2013
feature-detects/css-nthchild.js
@@ -0,0 +1,15 @@
+// nth-child pseudo selector
+Modernizr.addTest('nthchild', function(){
@sindresorhus
sindresorhus Jan 24, 2013 Member

function() {

@heeton
heeton commented Feb 14, 2013

👍

@bradgreens

+1

@stucox
Member
stucox commented Jun 26, 2013

This needs updating to the v3 format before we can accept it.

@emilchristensen are you able to do this, or does someone else fancy volunteering?

@emilchristensen
Contributor

I'll update it to v3 asap

@stucox
Member
stucox commented Jun 26, 2013

Great, thanks.

@emilchristensen
Contributor

Alright, this is updated and should adhere to the v3 principle and former comments in this thread.

@emilchristensen
Contributor

Need me to squash it before merge or are we good to go?

@stucox stucox Metadata / DOC improvements:
- Moved 'how it works' out of DOC block (this is for user documentation, rather than maintainer/implementation documentation – I've also clarified this on [the wiki](https://github.com/Modernizr/Modernizr/wiki/Authoring-a-v3-test))
- Turned `"authors"` and `"warnings"` fields into arrays
- Corrected `"property"` field to match name used in `Modernizr.addTest()` (these must be the same)
122f5be
@stucox
Member
stucox commented Jul 1, 2013

Thanks. I've raised a PR on your fork of the repo with a couple of changes to the metadata/DOC blocks.

If you're happy with that, could you merge that in, squash the commits and push again? Then we'll pull it in.

Thanks :-)

@emilchristensen
Contributor

I couldn't rebase n' squash all the way back I'm afraid. I'm guessing too big difference in the structure of how the project looked back then. I've been able to squash back to 1fe1e83. Do you want me to push that? Or do you have an idea on how to fix the problems (I'm thinking it's something with the files getting added in different places)

@stucox
Member
stucox commented Jul 1, 2013

Yeah if you could push that, that'll be fine – thanks.

@stucox stucox merged commit 97aaacd into Modernizr:master Jul 1, 2013

1 check passed

default The Travis CI build passed
Details
@stucox
Member
stucox commented Jul 1, 2013

Nice one, thanks @emilchristensen!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment