Why is split() function failing on only one condition but not another

Question

Context

I'm converting a create-react-app app to nextjs. Most of my work is ensuring existing components work for SSR.

I have one component that is throwing a build error of:

Error: text.split is not a function

For the final condition of this function:

function createRender(text, type, size, paragraphs, inline, nogap, url) {

    let renderObj;
    if (text) {
        // if text is an array, return a string of the array
        if (text instanceof Array) {
            text = text.join('');
        }
        if (type === "title") {
            renderObj = <h2>{text}</h2>
        } else if (paragraphs === true) {
            renderObj = text.split('\n').map((paragraph, index) => {
                if (paragraph !== "") {
                    return  <p>{paragraph}</p>
                }
            })
        } else {
            renderObj = text.split('\n').map((paragraph, index) => {
                if (paragraph !== "") {
                    return  <p >{paragraph}</p>
                }
            })
        }
    }

    return renderObj
}

Question

This split request (as far as I can see) is identical to that in the condition preceding it. Which doesn't throw an error.

This isn't an error occuring at runtime when something that isn't a string has been passed. This is a build error.

What am I missing that might be causing text in this one condition to throw this error? In my previous experience with javascript, I'd only get an error when running and a variable that wasn't a string had an attempted split. Here, a variable hasn't even been sent yet.

Also, why isn't it causing an error in the condition above it, with the exact same code? If I remove the final 'else' condition, I don't get the error.

Caveats

Ignore the logic in the conditions, I've removed some fluff to make this reproducible in its smallest form.

I'm using nextjs 13 and its app folder. I'm brand new to nextjs and saw this is an experimental features so I'm unsure if something exterior from this function is causing the issue.

---

Update 1

I've found that the error isn't thrown if I add a defined condition to the final else. As in, if I replace:

} else {
    renderObj = text.split('\n').map((paragraph, index) => {
        if (paragraph !== "") {
            return  <p >{paragraph}</p>
        }
    })
}

with

} else (any variable === anything) {
    renderObj = text.split('\n').map((paragraph, index) => {
        if (paragraph !== "") {
            return  <p >{paragraph}</p>
        }
    })
}

The condition definition is arbitrary. I can put size === 'melon' and it no longer throws an error.

Answer 1

I was too used to client-side-rendering and was still using the perspective that functions and variables only throw errors when building if there's bad code.

Whereas as this function is built for SSR, it's being passed actual real variables and is throwing an error in the same veign as I would have been familiar with during runtime on CSR.

So the problem was catching a bad variable that was meant to be a string but wasn't.