Stop using $set

src/components/report/FeatureControls.js

@@ -93,7 +93,7 @@ export default {
 					state = this.currentStates[feature.tag];
 				} else {
 					// No CSS state yet, set to "default" (null)
-					this.$set(this.currentStates, feature.tag, null);
+					this.currentStates[feature.tag] = null;
 					state = null;
 				}
 				if (state === null) continue;
@@ -111,8 +111,9 @@ export default {
 			}
 		},
 		toggleAlternate: function (feature, value) {
-			this.$set(this.currentStates, feature, value);
-			this.$set(this.alternateStates, feature, value);
+			this.currentStates[feature] = value;
+			this.alternateStates[feature] = value;
+
 			this.updateStyles();
 		},
 	},

src/components/report/OpenTypeFeatures.js

@@ -60,7 +60,7 @@ export default {
 				state = this.currentStates[feature];
 			} else {
 				// No CSS state yet, create one based off default state
-				this.$set(this.currentStates, feature, 1);
+				this.currentStates[feature] = 1;
 				state = 1;
 			}
 			return `font-feature-settings:"${feature}" ${

src/components/report/VariableControls.js

@@ -40,7 +40,7 @@ export default {
 				);
 				this.setAxis("opsz", opszValue);
 				// If axis was turned off, linking turns it on again
-				this.$set(this.currentStates, "opsz", true);
+				this.currentStates["opsz"] = true;
 				this.updateStyles();
 			}
 		},
@@ -129,11 +129,8 @@ export default {
 			}
 		},
 		flipState(axis, force) {
-			this.$set(
-				this.currentStates,
-				axis,
-				force || this.currentStates[axis] === false
-			);
+			this.currentStates[axis] =
+				force || this.currentStates[axis] === false;
 			if (axis === "opsz") {
 				this.$emit("unlinkOpticalSize");
 			}