Code review recycle

docs/reference/css_classes.md

@@ -64,7 +64,7 @@ Construct a CSS class attribute by joining together the controller identifier an
 </form>
 ```
 
-If you are working with utility classes and want to define multiple CSS classes for an attribute, separate the CSS class names with spaces.
+If you want to define multiple CSS classes for an attribute, separate the CSS class names with spaces.
 
 ## Properties
 
@@ -96,7 +96,7 @@ export default class extends Controller {
 
 **Note:** Stimulus will throw an error if you attempt to access a CSS class property when no matching CSS class attribute is present.
 
-If you are using utility classes, access the plural class property. You can apply the array of CSS classes to elements using [spread syntax](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax).
+If you want to use multiple classes, access the plural class property. You can apply the array of CSS classes to elements using [spread syntax](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax).
 
 <meta data-controller="callout" data-callout-text-value="...this.loadingClasses">
 

packages/@stimulus/core/src/class_map.ts

@@ -12,17 +12,12 @@ export class ClassMap {
   }
 
   get(name: string) {
-    return this.getAll(name)[0];
+    return this.getAll(name)[0]
   }
 
   getAll(name: string) {
-    const classAttribute = this.data.get(this.getDataKey(name));
-
-    if (classAttribute) {
-      return classAttribute.split(" ")
-    } else {
-      return []
-    }
+    const tokenString = this.data.get(this.getDataKey(name)) || ""
+    return tokenString.trim().split(/\s+/).filter(content => content.length)
   }
 
   getAttributeName(name: string) {

packages/@stimulus/core/src/tests/modules/class_tests.ts

@@ -1,7 +1,7 @@
 import { ControllerTestCase } from "../cases/controller_test_case"
 import { ClassController } from "../controllers/class_controller"
 
-export default class ValueTests extends ControllerTestCase(ClassController) {
+export default class ClassTests extends ControllerTestCase(ClassController) {
   fixtureHTML = `
     <div data-controller="${this.identifier}"
       data-${this.identifier}-active-class="test--active"
@@ -27,11 +27,11 @@ export default class ValueTests extends ControllerTestCase(ClassController) {
     this.assert.equal(this.controller.loadingClass, "busy")
   }
 
-  "test utility classes map to array"() {
+  "test multiple classes map to array"() {
     this.assert.deepEqual(this.controller.successClasses, ["bg-green-400", "border", "border-green-600"])
   }
 
-  "test accessing a class property returns first class if utility classes are used"() {
+  "test accessing a class property returns first class if multiple classes are used"() {
     this.assert.equal(this.controller.successClass, "bg-green-400");
   }
 }