[docs]] increase clarity of Selector documentation

Updates Selector documentation to explicitly explain `key` and `ref`, use proper CSS selector terminology, and re-organize to better differentiate from CSS-based selectors and React Prop Selectors.

docs/api/selector.md

@@ -1,7 +1,8 @@
 # enzyme Selectors
 
-Many methods in enzyme's API accept a *selector* as an argument. Selectors in enzyme can fall into
-one of the following four categories:
+Many methods in enzyme’s API accept a *selector* as an argument. Selectors in enzyme can fall into
+one of the following five categories:
+
 
 
 ### 1. A Valid CSS Selector
@@ -10,58 +11,62 @@ enzyme supports a subset of valid CSS selectors to find nodes inside a render tr
 follows:
 
 - class syntax (`.foo`, `.foo-bar`, etc.)
-- tag syntax (`input`, `div`, `span`, etc.)
+- element syntax (`input`, `div`, `span`, etc.)
 - id syntax (`#foo`, `#foo-bar`, etc.)
-- prop syntax (`[htmlFor="foo"]`, `[bar]`, `[baz=1]`, etc.);
-
-**Note -- Prop selector**
-Strings, numeric literals and boolean property values are supported for prop syntax
-in combination of the expected string syntax. For example, the following
-is supported:
-
-```js
-const wrapper = mount((
-  <div>
-    <span foo={3} bar={false} title="baz" />
-  </div>
-));
-
-wrapper.find('[foo=3]');
-wrapper.find('[bar=false]');
-wrapper.find('[title="baz"]');
-```
+- attribute syntax (`[href="foo"]`, `[type="text"]`, etc.)
 
 Further, enzyme supports combining any of those supported syntaxes together to uniquely identify a
-single node.  For instance:
+single node. For instance:
 
 ```css
 div.foo.bar
 input#input-name
-label[foo=true]
+a[href="foo"]
 ```
 
 enzyme also gives support for the following contextual selectors
 
-```
+```css
 .foo .bar
 .foo > .bar
 .foo + .bar
 .foo ~ .bar
 .foo input
 ```
 
-
 **Want more CSS support?**
 
-PR's implementing more support for CSS selectors will be accepted and is an area of development for
+PRs implementing more support for CSS selectors will be accepted and is an area of development for
 enzyme that will likely be focused on in the future.
 
 
 
-### 2. A React Component Constructor
+### 2. Prop Selector
+
+In addition to traditional CSS selectors, enzyme supports using a React prop like an Attribute Selector as if it were an HTML attribute. Strings, Numbers, and Boolean property values are supported.
+
+```js
+const wrapper = mount((
+  <div>
+    <span foo={3} bar={false} title="baz" />
+  </div>
+));
+
+wrapper.find('[foo=3]');
+wrapper.find('[bar=false]');
+wrapper.find('[title="baz"]');
+```
+
+**The Key and Ref Prop**
+
+While in most cases, any React prop can be used, there are exceptions. The `key` and `ref` props will never work. This decision comes from how React uses these props internally, which means they should not be relied upon.
+
+
+
+### 3. A React Component Constructor
 
 enzyme allows you to find components based on their constructor. You can pass in the reference to
-the component's constructor:
+the component’s constructor:
 
 ```jsx
 function MyComponent() {
@@ -74,9 +79,9 @@ const myComponents = wrapper.find(MyComponent);
 
 
 
-### 3. A React Component's displayName
+### 4. A React Component’s displayName
 
-enzyme allows you to find components based on a component's `displayName`. If a component exists
+enzyme allows you to find components based on a component’s `displayName`. If a component exists
 in a render tree where its `displayName` is set and has its first character as a capital letter,
 a string can be used to find it:
 
@@ -91,13 +96,13 @@ MyComponent.displayName = 'My Component';
 const myComponents = wrapper.find('My Component');
 ```
 
-NOTE: This will *only* work if the selector (and thus the component's `displayName`) is a string
+NOTE: This will *only* work if the selector (and thus the component’s `displayName`) is a string
 starting with a capital letter. Strings starting with lower case letters will assume it is a CSS
 selector using the tag syntax.
 
 
 
-### 4. Object Property Selector
+### 5. Object Property Selector
 
 enzyme allows you to find components and nodes based on a subset of their properties:
 
@@ -114,8 +119,9 @@ wrapper.find({ bar: false });
 wrapper.find({ title: 'baz' });
 ```
 
-**Note - undefined properties**
-are not allowed in the object property selector and will cause an error:
+**Undefined Properties**
+
+Undefined properties are not allowed in the object property selector and will cause an error:
 
 
 ```jsx