it('maps state to props', () => {
const { store } = createStore();
store.dispatch(setClientApp('android'));
store.dispatch(setLang('fr'));
store.dispatch(categoriesLoad(categoriesResponse));
const props = mapStateToProps(store.getState(), {
params: { visibleAddonType: 'extensions' },
});
expect(props).toEqual({
addonType: ADDON_TYPE_EXTENSION,
categories: {
Games: {
application: 'android',
name: 'Games',
slug: 'Games',
type: ADDON_TYPE_EXTENSION,
},
travel: {
application: 'android',
name: 'Travel',
slug: 'travel',
type: ADDON_TYPE_EXTENSION,
},
},
clientApp: 'android',
error: false,
loading: false,
});
});
it('gets isHomePage from store', () => {
const { store } = createStore();
store.dispatch(setViewContext(VIEW_CONTEXT_EXPLORE));
expect(mapStateToProps(store.getState())).toEqual({ isHomePage: false });
store.dispatch(setViewContext(VIEW_CONTEXT_HOME));
expect(mapStateToProps(store.getState())).toEqual({ isHomePage: true });
});
function renderLanguagePicker({ ...props }) {
const initialState = { api: { clientApp: 'android', lang: 'fr' } };
return findRenderedComponentWithType(renderIntoDocument(
<Provider store={createStore(initialState)}>
<LanguagePickerBase i18n={getFakeI18nInst()} {...props} />
</Provider>
), LanguagePickerBase);
}
function renderResult(result) {
const initialState = { api: { clientApp: 'android', lang: 'en-GB' } };
return findRenderedComponentWithType(renderIntoDocument(
<Provider store={createStore(initialState)}>
<SearchResult i18n={getFakeI18nInst()} addon={result} />
</Provider>
), SearchResult).getWrappedInstance();
}
function render({ ...props }) {
return findDOMNode(findRenderedComponentWithType(renderIntoDocument(
<Provider store={createStore(initialState)}>
<I18nProvider i18n={getFakeI18nInst()}>
<LandingPageBase i18n={getFakeI18nInst()} {...props} />
</I18nProvider>
</Provider>
), LandingPageBase));
}
const renderProps = (customProps = {}) => ({
_config: getFakeConfig({ client: true }),
addon: createInternalAddon(fakeAddon),
getClientCompatibility: () => ({ compatible: true }),
hasAddonManager: true,
i18n: fakeI18n(),
store: createStore().store,
userAgentInfo: sampleUserAgentParsed,
...customProps,
});
function renderMastHead({ ...props }) {
const MyMastHead = translate({ withRef: true })(MastHeadBase);
const initialState = { api: { clientApp: 'android', lang: 'en-GB' } };
return findRenderedComponentWithType(renderIntoDocument(
<Provider store={createStore(initialState)}>
<MyMastHead i18n={getFakeI18nInst()} {...props} />
</Provider>
), MyMastHead).getWrappedInstance();
}
it('renders each add-on when set', () => {
const store = createStore(initialState);
store.dispatch(landingActions.loadLanding({
featured: {
entities: {
addons: {
howdy: {
...fakeAddon, name: 'Howdy', slug: 'howdy',
},
'howdy-again': {
...fakeAddon, name: 'Howdy again', slug: 'howdy-again',
},
},
},
result: { count: 50, results: ['howdy', 'howdy-again'] },
},
highlyRated: {
entities: {
addons: {
high: {
...fakeAddon, name: 'High', slug: 'high',
},
'high-again': {
...fakeAddon, name: 'High again', slug: 'high-again',
},
},
},
result: { count: 50, results: ['high', 'high-again'] },
},
popular: {
entities: {
addons: {
pop: {
...fakeAddon, name: 'Pop', slug: 'pop',
},
'pop-again': {
...fakeAddon, name: 'Pop again', slug: 'pop-again',
},
},
},
result: { count: 50, results: ['pop', 'pop-again'] },
},
}));
const root = render({
...singularizeAddonType(null, { params: { pluralAddonType: 'themes' } }),
...mapStateToProps(store.getState()),
});
assert.deepEqual(
Object.values(root.querySelectorAll('.SearchResult-heading'))
.map((heading) => heading.textContent),
['Howdy', 'Howdy again', 'High', 'High again', 'Pop', 'Pop again']
);
});
function renderResults(props) {
const initialState = { api: { clientApp: 'android', lang: 'en-GB' } };
const { store } = createStore(initialState);
return findRenderedComponentWithType(render(
<Provider store={store}>
<I18nProvider i18n={getFakeI18nInst()}>
<SearchResults {...props} />
</I18nProvider>
</Provider>
), SearchResults).getWrappedInstance();
}
it('returns a rejected Promise if the addonsType is wrong', () => {
const { store } = createStore({ application: 'android' });
return loadLandingAddons({
store,
params: { ...ownProps.params, visibleAddonType: 'addon-with-a-typo' },
})
.then(unexpectedSuccess)
.catch((err) => {
expect(err.message).toEqual('"addon-with-a-typo" not found in API_ADDON_TYPES_MAPPING');
});
});
it('does not pass search state if the filters and state do not match', () => {
const store = createStore();
store.dispatch(searchStart({ filters }));
const mismatchedState = store.getState();
mismatchedState.search.filters.clientApp = 'nothing';
const props = mapStateToProps(mismatchedState, ownProps);
assert.deepEqual(props, {
hasSearchParams: true,
pathname: '/themes/ad-block/',
queryParams: { page: 1 },
});
});
function renderHeader({ ...props }) {
const { store } = createStore();
store.dispatch(setClientApp('android'));
store.dispatch(setLang('en-GB'));
const fakeI18n = getFakeI18nInst();
return findRenderedComponentWithType(renderIntoDocument(
<Provider store={store}>
<I18nProvider i18n={fakeI18n}>
<HeaderBase i18n={fakeI18n} {...props} />
</I18nProvider>
</Provider>
), HeaderBase);
}
export function dispatchClientMetadata({
store = createStore().store,
clientApp = 'android',
lang = 'en-US',
userAgent = sampleUserAgent,
} = {}) {
store.dispatch(setClientApp(clientApp));
store.dispatch(setLang(lang));
store.dispatch(setUserAgent(userAgent));
return {
store,
state: store.getState(),
};
}
it('passes the search state if the filters and state matches', () => {
const store = createStore();
store.dispatch(searchStart({ filters, results: [] }));
const props = mapStateToProps(store.getState(), ownProps);
assert.deepEqual(props, {
count: 0,
filters,
hasSearchParams: true,
loading: true,
page: undefined,
pathname: '/themes/ad-block/',
queryParams: { page: 1 },
results: [],
});
});
it('adds amo_request_id to RavenJs', async () => {
const _config = getFakeConfig({ publicSentryDsn: 'example-dsn' });
const _RavenJs = createFakeRavenJs();
const storeResult = createAmoStore();
const requestId = 'example-request-id';
storeResult.store.dispatch(setRequestId(requestId));
await _createClient({
createStore: () => storeResult,
_config,
_RavenJs,
});
sinon.assert.calledWith(_RavenJs.setTagsContext, {
amo_request_id: requestId,
});
});
beforeEach(() => {
errorHandler = createStubErrorHandler();
store = createStore().store;
store.dispatch(setClientApp('firefox'));
store.dispatch(setLang('en-US'));
const state = store.getState();
initialState = {
api: state.api,
categories: state.categories,
};
sagaTester = new SagaTester({
initialState,
reducers: { api: apiReducer, categories: categoriesReducer },
});
sagaTester.start(categoriesSaga);
});
function render({ ...props }) {
const { store } = createStore();
store.dispatch(setClientApp('android'));
store.dispatch(setLang('fr'));
store.dispatch(categoriesLoad(categoriesResponse));
const { categories } = store.getState().categories;
const baseProps = {
clientApp: store.getState().api.clientApp,
categories: categories[CLIENT_APP_ANDROID][ADDON_TYPE_EXTENSION],
dispatch: sinon.stub(),
};
return findRenderedComponentWithType(renderIntoDocument(
<Provider store={store}>
<CategoriesBase i18n={getFakeI18nInst()} {...baseProps} {...props} />
</Provider>
), CategoriesBase);
}
it('calls featured and search APIs to collect results', () => {
const addonType = ADDON_TYPE_THEME;
const { store } = createStore({ application: 'android' });
store.dispatch(landingActions.getLanding({ addonType }));
const mockApi = sinon.mock(api);
const entities = sinon.stub();
const result = sinon.stub();
mockApi
.expects('featured')
.once()
.withArgs({
api: { ...initialApiState }, filters: { addonType, page_size: 4 },
})
.returns(Promise.resolve({ entities, result }));
mockApi
.expects('search')
.once()
.withArgs({
api: { ...initialApiState },
filters: { addonType, page_size: 4, sort: SEARCH_SORT_TOP_RATED },
page: 1,
})
.returns(Promise.resolve({ entities, result }));
mockApi
.expects('search')
.once()
.withArgs({
api: { ...initialApiState },
filters: { addonType, page_size: 4, sort: SEARCH_SORT_POPULAR },
page: 1,
})
.returns(Promise.resolve({ entities, result }));
return loadLandingAddons({
store,
params: { ...ownProps.params, visibleAddonType: 'themes' },
})
.then(() => {
mockApi.verify();
});
});
function render(
{
props = { params: { slug: fakeAddon.slug } },
state = {
addons: {
[fakeAddon.slug]: fakeAddon,
},
},
} = {}
) {
const store = createStore(state);
return findRenderedComponentWithType(renderIntoDocument(
<I18nProvider i18n={getFakeI18nInst()}>
<Provider store={store}>
<DetailPage {...props} />
</Provider>
</I18nProvider>
), DetailPage);
}
it('requests a large page of featured add-ons', () => {
const addonType = ADDON_TYPE_EXTENSION;
const { store } = createStore({ application: 'android' });
store.dispatch(featuredActions.getFeatured({ addonType }));
const mockApi = sinon.mock(api);
const entities = sinon.stub();
const result = { results: [] };
mockApi
.expects('featured')
.once()
.withArgs({
api: { ...initialApiState }, filters: { addonType, page_size: 25 },
})
.returns(Promise.resolve({ entities, result }));
return loadFeaturedAddons({ store, params: ownProps.params })
.then(() => {
mockApi.verify();
});
});
it('returns right away when loaded', () => {
const store = createStore({ application: 'android' });
store.dispatch(landingActions.getLanding({ addonType }));
const mockApi = sinon.mock(api);
const entities = sinon.stub();
const result = sinon.stub();
mockApi
.expects('featured')
.once()
.withArgs({ api: {}, filters: { addonType, page_size: 4 } })
.returns(Promise.resolve({ entities, result }));
mockApi
.expects('search')
.once()
.withArgs({
api: {},
filters: { addonType, page_size: 4, sort: 'rating' },
page: 1,
})
.returns(Promise.resolve({ entities, result }));
mockApi
.expects('search')
.once()
.withArgs({
api: {},
filters: { addonType, page_size: 4, sort: 'hotness' },
page: 1,
})
.returns(Promise.resolve({ entities, result }));
return loadLandingAddons({ store, params: ownProps.params })
.then(() => {
mockApi.verify();
});
});
beforeEach(() => {
// Set up an empty store and let each test call
// dispatchClientMetadata().
store = createStore().store;
});
beforeEach(() => {
store = createStore().store;
store.dispatch(setClientApp('android'));
store.dispatch(setLang('fr'));
});
beforeEach(() => {
store = createStore();
});
it('creates an empty store', () => {
const { store } = createStore();
expect(store.getState().addons).toEqual(initialState);
});