Add Selenium integration test framework

src/ts/ribbit-editor.ts

@@ -52,6 +52,7 @@ export class RibbitEditor extends Ribbit {
             this.element.parentNode?.insertBefore(this.toolbar.render(), this.element);
         }
         this.view();
+        this.emitReady();
     }
 
     #bindEvents(): void {

src/ts/ribbit.ts

@@ -146,12 +146,7 @@ export class Ribbit {
         this.emitter.off(event, callback);
     }
 
-    run(): void {
-        this.element.classList.add('loaded');
-        if (this.autoToolbar) {
-            this.element.parentNode?.insertBefore(this.toolbar.render(), this.element);
-        }
-        this.view();
+    protected emitReady(): void {
         this.emitter.emit('ready', {
             markdown: this.getMarkdown(),
             html: this.getHTML(),
@@ -160,6 +155,15 @@ export class Ribbit {
         });
     }
 
+    run(): void {
+        this.element.classList.add('loaded');
+        if (this.autoToolbar) {
+            this.element.parentNode?.insertBefore(this.toolbar.render(), this.element);
+        }
+        this.view();
+        this.emitReady();
+    }
+
     getState(): string | null {
         return this.state;
     }

src/ts/toolbar.ts

@@ -281,6 +281,7 @@ export class ToolbarManager {
         const li = document.createElement('li');
         const btn = document.createElement('button');
         btn.className = `ribbit-btn-${button.id}`;
+        btn.textContent = button.label;
         btn.setAttribute('aria-label', button.label);
         btn.title = button.shortcut
             ? `${button.label} (${button.shortcut})`
@@ -298,6 +299,7 @@ export class ToolbarManager {
         const li = document.createElement('li');
         const toggle = document.createElement('button');
         toggle.className = 'ribbit-btn-group';
+        toggle.textContent = group.label + ' ▾';
         toggle.setAttribute('aria-label', group.label);
         toggle.title = group.label;