diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/MenuItem.mjs | 41 |
1 files changed, 28 insertions, 13 deletions
diff --git a/src/MenuItem.mjs b/src/MenuItem.mjs index cb64f85..026e5bf 100644 --- a/src/MenuItem.mjs +++ b/src/MenuItem.mjs | |||
@@ -201,28 +201,43 @@ export const renderResults = ({ modal, modalContent }, map) => | |||
201 | }, | 201 | }, |
202 | }); | 202 | }); |
203 | 203 | ||
204 | function printObject(obj, parentElement, name) { | 204 | function printObject(obj, parentElement, name = null) { |
205 | // Create <details> and <summary> inside | ||
205 | const detailsEle = document.createElement('details'); | 206 | const detailsEle = document.createElement('details'); |
206 | const details = name ?? Object.values(obj)[0]; | 207 | const details = name ?? (obj instanceof Error ? obj.name : Object.values(obj)[0]); |
207 | detailsEle.innerHTML = `<summary>${details}</summary`; | 208 | detailsEle.innerHTML = `<summary>${details}</summary>`; |
208 | parentElement.appendChild(detailsEle); | 209 | parentElement.appendChild(detailsEle); |
209 | 210 | ||
210 | detailsEle.onclick = () => { | 211 | detailsEle.onclick = () => { |
212 | // Don't add items if it has contents | ||
211 | if (detailsEle.querySelector(':scope > :not(summary)')) return; | 213 | if (detailsEle.querySelector(':scope > :not(summary)')) return; |
212 | 214 | ||
213 | Object.entries(obj).forEach(([key, value]) => { | 215 | if (obj instanceof Error) { |
214 | if (typeof value === 'object') { | 216 | // Handle Error objects specially |
215 | printObject(value, detailsEle, key); | 217 | const errorProps = ['name', 'message', 'stack', ...Object.keys(obj)]; |
216 | } else { | 218 | errorProps.forEach(key => { |
217 | const valueString = | 219 | const value = obj[key]; |
218 | typeof value === 'function' | 220 | const valueString = key === 'stack' ? `<pre>${value}</pre>` : value; |
219 | ? `<pre>${value}</pre>` | ||
220 | : value ?? typeof value; | ||
221 | const propertyElement = document.createElement('p'); | 221 | const propertyElement = document.createElement('p'); |
222 | propertyElement.innerHTML = `<strong>${key}</strong>: ${valueString}`; | 222 | propertyElement.innerHTML = `<strong>${key}</strong>: ${valueString}`; |
223 | detailsEle.appendChild(propertyElement); | 223 | detailsEle.appendChild(propertyElement); |
224 | } | 224 | }); |
225 | }); | 225 | } else { |
226 | // Handle regular objects | ||
227 | Object.entries(obj).forEach(([key, value]) => { | ||
228 | if (typeof value === 'object' && value !== null) { | ||
229 | printObject(value, detailsEle, key); | ||
230 | } else { | ||
231 | const valueString = | ||
232 | typeof value === 'function' | ||
233 | ? `<pre>${value}</pre>` | ||
234 | : value ?? typeof value; | ||
235 | const propertyElement = document.createElement('p'); | ||
236 | propertyElement.innerHTML = `<strong>${key}</strong>: ${valueString}`; | ||
237 | detailsEle.appendChild(propertyElement); | ||
238 | } | ||
239 | }); | ||
240 | } | ||
226 | }; | 241 | }; |
227 | } | 242 | } |
228 | 243 | ||