Code to start with

Author: davidtheclark

.gitignore

@@ -0,0 +1 @@
+node_modules

README.md

@@ -1,2 +1,56 @@
 # postcss-resolve-nested-selector
-Resolve a nested selector in a PostCSS AST
+
+Resolve a nested selector in a PostCSS AST.
+
+## API
+
+`resolveNestedSelector(selector, node)`
+
+Returns an array of selectors resolved from `selector`.
+
+For example, given this JS:
+
+```js
+var resolvedNestedSelector = require('postcss-resolve-nested-selector');
+postcssRoot.eachRule(function(rule) {
+  var resolvedSelectors = rule.selectors.map(function(selector) {
+    return resolvedNestedSelector(selector, rule);
+  });
+});
+```
+
+And the following CSS:
+
+```css
+.foo {
+  .bar {
+    color: pink;
+  }
+}
+```
+
+This should log:
+
+```
+['.foo']
+['.foo .bar']
+```
+
+Or with this CSS:
+
+```css
+.foo {
+  .bar &,
+  a {
+    color: pink;
+  }
+}
+```
+
+This should log:
+
+```
+['.foo']
+['.bar .foo']
+['.foo a']
+```

index.js

@@ -0,0 +1,19 @@
+module.exports = function resolveNestedSelector(selector, node) {
+  var parent = node.parent;
+  if (parent.type === 'root') return [selector];
+  if (parent.type !== 'rule') return resolveNestedSelector(selector, parent);
+
+  var resolvedSelectors = parent.selectors.reduce(function(result, parentSelector) {
+    if (selector.indexOf('&') !== -1) {
+      var newlyResolvedSelectors = resolveNestedSelector(parentSelector, parent).map(function(resolvedParentSelector) {
+        return selector.replace(/&/g, resolvedParentSelector);
+      });
+      return result.concat(newlyResolvedSelectors);
+    }
+
+    var combinedSelector = [ parentSelector, selector ].join(' ');
+    return result.concat(resolveNestedSelector(combinedSelector, parent));
+  }, []);
+
+  return resolvedSelectors;
+}

package.json

@@ -0,0 +1,21 @@
+{
+  "name": "postcss-resolve-nested-selector",
+  "version": "0.1.0",
+  "description": "Resolve a nested selector in a PostCSS AST",
+  "main": "index.js",
+  "scripts": {
+    "test": "ava test/*-test.js"
+  },
+  "author": "David Clark",
+  "license": "MIT",
+  "files": [
+    "index.js"
+  ],
+  "devDependencies": {
+    "ava": "0.12.0",
+    "postcss": "5.0.16",
+    "postcss-nested": "1.0.0",
+    "postcss-nesting": "2.2.0",
+    "tape": "4.4.0"
+  }
+}

test/postcss-nested-test.js

@@ -0,0 +1,184 @@
+import test from 'ava';
+import util from './util';
+
+// tests copied from https://github.com/postcss/postcss-nested
+
+test('postcss-nested unwraps rule inside rule', async t => {
+  const code = 'a { a: 1 } a { a: 1; b { b: 2; c { c: 3 } } }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a', 'a', 'a b', 'a b c'],
+  );
+});
+
+test('postcss-nested cleans rules after unwrap', async t => {
+  const code = 'a { b .one {} b .two {} }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a b .one', 'a b .two'],
+  );
+});
+
+test('postcss-nested replaces ampersand', async t => {
+  const code = 'a { body &:hover b {} }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['body a:hover b'],
+  );
+});
+
+test('postcss-nested replaces ampersands', async t => {
+  const code = 'a { &:hover, &:active {} }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a:active', 'a:hover'],
+  );
+});
+
+test('postcss-nested replaces ampersand in string', async t => {
+  const code = '.block { &_elem {} }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['.block_elem'],
+  );
+});
+
+test('postcss-nested unwrap rules inside at-rules', async t => {
+  const code = '@media (max-width: 500px) { a { b {} } }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a b'],
+  );
+});
+
+test('postcss-nested unwraps at-rule', async t => {
+  const code = 'a { b { @media screen { width: auto } } }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a b'],
+  );
+});
+
+test('postcss-nested unwraps at-rule with rules', async t => {
+  const code = 'a { @media screen { b { color: black } } }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a b'],
+  );
+});
+
+test('postcss-nested unwraps at-rules', async t => {
+  const code = 'a { a: 1 } a { @media screen { @supports (a: 1) { a: 1 } } }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a', 'a'],
+  );
+});
+
+test('postcss-nested processes comma', async t => {
+  const code = '.one, .two { a {} }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['.one a', '.two a'],
+  );
+});
+
+test('postcss-nested processes comma with ampersand', async t => {
+  const code = '.one, .two { &:hover {} }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['.one:hover', '.two:hover'],
+  );
+});
+
+test('postcss-nested processes comma inside', async t => {
+  const code = 'a, b { .one, .two {} }';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a .one', 'a .two', 'b .one', 'b .two'],
+  );
+});
+
+test('postcss-nested moves comment with rule', async t => {
+  const code = 'a {\n    /*B*/\n    b {}\n}';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a b'],
+  );
+});
+
+test('postcss-nested moves comment with at-rule', async t => {
+  const code = 'a {\n    /*B*/\n    @media {\n        one: 1\n    }\n}';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a'],
+  );
+});
+
+test('postcss-nested moves comment with declaration', async t => {
+  const code = 'a {\n    @media {\n        /*B*/\n        one: 1\n    }\n}';
+  t.same(
+    await util.postcssNestedResolve(code),
+    await util.expected(code),
+  );
+  t.same(
+    await util.expected(code),
+    ['a'],
+  );
+});