Skip to content
This repository has been archived by the owner on Dec 30, 2022. It is now read-only.

Commit

Permalink
feat(ssr): forward propsData to recreated component
Browse files Browse the repository at this point in the history
TODO: this throws a warning (but works) because of:

https://github.com/vuejs/vue/blob/7912f75c5eb09e0aef3e4bfd8a3bb78cad7540d7/src/core/util/options.js#L34-L44

I'm not fully sure how to do `new Vue` or pass this parameter correctly. If I `Object.assign` it for `app = new Vue({...extended, propsData})`, it also doesn't work :/
  • Loading branch information
Haroenv committed Sep 29, 2020
1 parent aeea263 commit dca2d01
Show file tree
Hide file tree
Showing 2 changed files with 52 additions and 0 deletions.
51 changes: 51 additions & 0 deletions src/util/__tests__/createServerRootMixin.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -311,6 +311,57 @@ Array [

await renderToString(wrapper);
});

it('forwards props', async () => {
const searchClient = createFakeClient();

// there are two renders of App, each with an assertion
expect.assertions(2);

const someProp = { data: Math.random() };

const App = Vue.component('App', {
mixins: [
forceIsServerMixin,
createServerRootMixin({
searchClient,
indexName: 'hello',
}),
],
props: {
someProp: {
required: true,
type: Object,
validator(value) {
expect(value).toBe(someProp);
return value === someProp;
},
},
},
render(h) {
return h(InstantSearchSsr, {}, [
h(Configure, {
attrs: {
hitsPerPage: 100,
},
}),
h(SearchBox),
]);
},
serverPrefetch() {
return this.instantsearch.findResultsState(this);
},
});

const wrapper = new Vue({
mixins: [forceIsServerMixin],
render(h) {
return h(App, { props: { someProp } });
},
});

await renderToString(wrapper);
});
});

describe('hydrate', () => {
Expand Down
1 change: 1 addition & 0 deletions src/util/createServerRootMixin.js
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@ function augmentInstantSearch(instantSearchOptions, searchClient, indexName) {
// copy over global Vue APIs
router: componentInstance.$router,
store: componentInstance.$store,
propsData: componentInstance.$options.propsData,
};

const extended = componentInstance.$vnode
Expand Down

0 comments on commit dca2d01

Please sign in to comment.