Javascript searchbar med API

Jag vill kunna söka på Wikipedia med denna kod, men när jag kör den får jag bara fram "this.searchUpdate is not a fuction." och jag förstår inte varför. Tacksam för all hjälp jag kan få!

Här är min kod:

const template = document.createElement('template')
template.innerHTML = `
<style>
h1 {
font-family: times new roman;
font-size: 30px;
}
</style>
<h1>WikiSearch</h1>
<input type="search" placeholder="Search Wikipedia.." id="searchbar">
<button type="submit" id="button">Search</button>`

/**
* Define custom element.
*/
customElements.define('my-wiki-search',
class extends HTMLElement {
constructor () {
super()
this.attachShadow({ mode: 'open' })
.appendChild(template.content.cloneNode(true))
this._searchbar = this.shadowRoot.querySelector('#searchbar')
this._button = this.shadowRoot.querySelector('#button')
this._search
}

async getSearchResult (word) {
const search = await window.fetch(`https://en.wikipedia.org/w/api.php?action=query&list=search&format=json&origin=*&srsearch=${word}`)
console.log(search.json())
}

async searchUpdate (str) {
let result = await window.fetch(`https://en.wikipedia.org/w/api.php?action=query&list=search&format=json&origin=*&srsearch=${str}`)
result = await result.json
searchPromises = []
result.result.forEach(id => {
searchPromises.push(this.getSearchResult(id))
})
this._search = await Promise.all(searchPromises)
}

connectedCallback () {
this._button.addEventListener('click', function() {
this.searchUpdate(this._searchbar).then (()=> this._updateRendering())
})
}

})