breadcrumb error on Vue/ SSR

Hi,

I use Vue, with Server Side Rendering and Bootstrap-vue 0.14.0.

When I reproduce the exemple here on your website https://bootstrap-vue.github.io/docs/components/breadcrumb , I get a warning from SSR with b-breadcrumb :

[Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>, or missing <tbody>. Bailing hydration and performing full client-side render.

Maybe the problem is this one, the code look like this :

<section id="breadcrumb" class="row no-gutters align-items-center">
    <div class="container extra-padding">
        <div class="row">
            <div class="col">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a **active-class="active"** href="#">Admin</a></li>
                    <li class="breadcrumb-item"><a **active-class="active"** href="#">Manage</a></li>
                    <li class="breadcrumb-item active"><span>Library</span></li>
                </ol>
            </div>
        </div>
    </div>
</section>

Like you see, the attribute on is active-class=“active”.

The active-class=“active” is not a valid attribute, maybe the problem is there ? Error: Attribute active-class not allowed on element a at this point.

Is your code is compatible with SSR ?

Thanks for the help,

Hugo

[hvalcourtSerdy]

Ok, I will wait for merge, and test if the issue is fixed. Thanks!

[alexsasharegan]

You know what, I think I fixed this. The problem appears to be around proxying the correct props from breadcrumb to the link component. PR #520 addresses this and appears to fix it.