Merge pull request #3186 from NoelDeMartin/MOBILE-3833
MOBILE-3833: Fix RTE & aria-label reactivity
This commit is contained in:
		
						commit
						401f8aa2bd
					
				@ -33,15 +33,18 @@ export class CoreUpdateNonReactiveAttributesDirective implements OnInit, OnDestr
 | 
				
			|||||||
    constructor(element: ElementRef<HTMLIonButtonElement>) {
 | 
					    constructor(element: ElementRef<HTMLIonButtonElement>) {
 | 
				
			||||||
        this.element = element.nativeElement;
 | 
					        this.element = element.nativeElement;
 | 
				
			||||||
        this.mutationObserver = new MutationObserver(() => {
 | 
					        this.mutationObserver = new MutationObserver(() => {
 | 
				
			||||||
            const ariaLabel = this.element.getAttribute('aria-label');
 | 
					            const button = this.element.shadowRoot?.querySelector('button');
 | 
				
			||||||
            if (!ariaLabel) {
 | 
					
 | 
				
			||||||
                // Aria label unset by ionButton component (when first created).
 | 
					            if (!button) {
 | 
				
			||||||
                return;
 | 
					                return;
 | 
				
			||||||
            }
 | 
					            }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
            // Propagate label to button.
 | 
					            // Propagate label to button.
 | 
				
			||||||
            const button = this.element.shadowRoot?.querySelector('button');
 | 
					            const ariaLabel = this.element.getAttribute('aria-label');
 | 
				
			||||||
            button?.setAttribute('aria-label', ariaLabel);
 | 
					
 | 
				
			||||||
 | 
					            ariaLabel
 | 
				
			||||||
 | 
					                ? button.setAttribute('aria-label', ariaLabel)
 | 
				
			||||||
 | 
					                : button.removeAttribute('aria-label');
 | 
				
			||||||
        });
 | 
					        });
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -51,10 +54,6 @@ export class CoreUpdateNonReactiveAttributesDirective implements OnInit, OnDestr
 | 
				
			|||||||
    async ngOnInit(): Promise<void> {
 | 
					    async ngOnInit(): Promise<void> {
 | 
				
			||||||
        await this.element.componentOnReady();
 | 
					        await this.element.componentOnReady();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        if (!this.element.getAttribute('aria-label')) {
 | 
					 | 
				
			||||||
            return;
 | 
					 | 
				
			||||||
        }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        this.mutationObserver.observe(this.element, { attributes: true, attributeFilter: ['aria-label'] });
 | 
					        this.mutationObserver.observe(this.element, { attributes: true, attributeFilter: ['aria-label'] });
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
				
			|||||||
@ -176,6 +176,8 @@ export class CoreEditorRichTextEditorComponent implements OnInit, AfterContentIn
 | 
				
			|||||||
        this.editorElement.oninput = this.onChange.bind(this);
 | 
					        this.editorElement.oninput = this.onChange.bind(this);
 | 
				
			||||||
        this.editorElement.onkeydown = this.moveCursor.bind(this);
 | 
					        this.editorElement.onkeydown = this.moveCursor.bind(this);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					        await CoreDomUtils.waitToBeVisible(this.editorElement);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        // Use paragraph on enter.
 | 
					        // Use paragraph on enter.
 | 
				
			||||||
        document.execCommand('DefaultParagraphSeparator', false, 'p');
 | 
					        document.execCommand('DefaultParagraphSeparator', false, 'p');
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user