vueuse/head

bug: using `nuxt@latest`

cpreston321 opened this issue · 1 comments

Error Context

Nuxi 3.0.0-rc.12-27768075.6567ac3                                                                                                           
ℹ Node.js version: 18.9.0                                                                                                                    11:25:27
ℹ Preset: node-server                                                                                                                        11:25:27
ℹ Working dir: .output                                                                                                                       11:25:27
ℹ Loading .env. This will not be loaded when running the server in production.                                                               11:25:27
ℹ Starting preview command: node ./server/index.mjs                                                                                          11:25:27
                                                                                                                                             11:25:27
Listening http://[::]:3000
lang en-US
hasTransition true
[nuxt] [request error] [unhandled] [500] str.replace is not a function
  at sanitiseAttrValue (./server/chunks/app/server.mjs:749:7)  
  at renderHeadToString (./server/chunks/app/server.mjs:795:47)  
  at nuxtApp.ssrContext.renderMeta (./server/chunks/app/server.mjs:1259:27)  
  at ./server/chunks/handlers/renderer.mjs:418:53  
  at async ./server/chunks/handlers/renderer.mjs:59:22  
  at async Object.handler (./server/node_modules/h3/dist/index.mjs:566:19)  
  at async Server.toNodeHandle (./server/node_modules/h3/dist/index.mjs:630:7)

I was diving deeper into the chunks on the server side and saw that renderHeadToString() was trying to sanitize a boolean value.

Note
This only happens when I built the project and try to preview.

Here is the code I was logging to trace the error

var renderHeadToString = async (head) => {
    ....
    for (const k in tag.props) {
       console.log(k, tag.props[k]);
       attrs[tag.tag][sanitiseAttrName(k)] = sanitiseAttrValue(tag.props[k]);
     }
     ....
}
     
var sanitiseAttrValue = (str) => escapeJS(
 str.replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;")
);

What I see when I preview

image

Fixed in #143, available in v1.0.0-rc.11