take class without string, update registry to use new parsing

This commit is contained in:
metacryst
2024-03-13 16:15:22 -05:00
parent fc4434b5de
commit 3b7aad5786
2 changed files with 7 additions and 11 deletions

View File

@@ -22,7 +22,7 @@ testParseClassFieldsWithEqualityCheck() {
} }
} }
const fields = window.Registry.parseClassFields(Space.toString()); const fields = window.Registry.parseClassFields(Space);
if(!(JSON.stringify(fields) === JSON.stringify(["form", "contents"]))) { if(!(JSON.stringify(fields) === JSON.stringify(["form", "contents"]))) {
return `Fields don't match` return `Fields don't match`
} }
@@ -52,7 +52,7 @@ testParseClassFieldsWithInnerFunctionVariable() {
} }
} }
const fields = window.Registry.parseClassFields(Space.toString()); const fields = window.Registry.parseClassFields(Space);
if(!(JSON.stringify(fields) === JSON.stringify(["form", "contents"]))) { if(!(JSON.stringify(fields) === JSON.stringify(["form", "contents"]))) {
return `Fields don't match` return `Fields don't match`
} }

View File

@@ -18,8 +18,9 @@ window.$ = function(selector, el = document) {
window.Registry = class Registry { window.Registry = class Registry {
static parseClassFields(classStr) { static parseClassFields(classObject) {
const lines = classStr.split('\n'); let str = classObject.toString();
const lines = str.split('\n');
const fields = []; const fields = [];
let braceDepth = 0; // Tracks the depth of curly braces to identify when we're inside a function/method let braceDepth = 0; // Tracks the depth of curly braces to identify when we're inside a function/method
@@ -50,12 +51,7 @@ window.Registry = class Registry {
} }
static registerElement = (el, tagname) => { static registerElement = (el, tagname) => {
const randomClassName = 'Custom' + Math.random().toString(36).substring(2, 7); let stateVariables = this.parseClassFields(el).filter(field => field.startsWith('$'));
const DynamicClass = {[randomClassName]: class extends el {}}[randomClassName];
const randomTagName = 'custom-' + Math.random().toString(36).substring(2, 7);
customElements.define(randomTagName, DynamicClass);
const instance = new DynamicClass();
let stateVariables = Object.keys(instance).filter(field => field.startsWith('$'));
let stateVariablesWithout$ = stateVariables.map(str => str.substring(1)); let stateVariablesWithout$ = stateVariables.map(str => str.substring(1));
// Observe attributes // Observe attributes
@@ -136,7 +132,7 @@ window.Registry = class Registry {
} }
// Check if all state variables are set // Check if all state variables are set
for(state of stateVariables) { for(let state of stateVariables) {
console.log(elem[state]) console.log(elem[state])
if(!elem[state]) { if(!elem[state]) {
console.error(`Quill: state ${state} must be initialized`) console.error(`Quill: state ${state} must be initialized`)