React Storybook showing only three unit tests - reactjs

Question

I am facing a very strange situation. I have 9 unit tests that are running perfectly well when I run it through jest command. But when I run storybook it just shows 3 tests out of 9. Storybook version is 5.1.7.
Test which is showing on storybook - Filter Search Orders -
import React from "react";
import expect from "expect";
import { mount } from "enzyme";
import _ from "lodash";
import Root from "../../root";
import { storiesOf, describe, it, specs, beforeEach, afterEach } from "../../../.storybook/facade";
import FilterSearchOrders from "../search-orders/filter-search-orders";
import ordersFilterOptions from "../search-orders/orders-filters-options";
const filterSearchOrdersInfo = {
searchedText: "",
status: "",
pageNo: 0,
};
const getElement = () => {
return (
<Root>
<FilterSearchOrders
searchedText={filterSearchOrdersInfo.searchedText}
status={filterSearchOrdersInfo.status}
pageNo={filterSearchOrdersInfo.pageNo}
/>
</Root>
);
};
storiesOf("Filter Search Orders", module).add("Filter Search Orders", () => {
specs(() =>
describe("Test case for filter search order component", () => {
let wrapper;
beforeEach(() => {
wrapper = mount(getElement());
});
afterEach(() => {
wrapper.unmount();
});
it("should render an input box for searching", () => {
expect(wrapper.find(".search-orders-input"));
});
it("should render a dropdown with options", () => {
const dropdownOptions = wrapper.find(".item").map((node) => node.text());
const items = _.map(ordersFilterOptions, _.property("text"));
expect(dropdownOptions).toEqual(items);
});
it("should render a primary button called search", () => {
expect(wrapper.find(".primary").text()).toEqual("SEARCH");
});
})
);
return getElement();
});
Test not showing on storybook - Menu story -
import React from "react";
import expect from "expect";
import { mount } from "enzyme";
import _ from "lodash";
import { DASHBOARDITEMS } from "../menu/menuItems";
import { storiesOf, describe, it, specs } from "../../../.storybook/facade";
import NavBar from "../menu";
import Root from "../../root";
const getElement = () => {
return (
<Root>
<NavBar items={DASHBOARDITEMS} />
</Root>
);
};
storiesOf("Menu", module).add("Navigation Bar component", () => {
specs(() =>
describe("Main menu", () => {
it("should render menu", () => {
const wrapper = mount(getElement());
expect(wrapper.find(".nestedMenu"));
});
it("should render an image to show logo", () => {
const wrapper = mount(getElement());
expect(
wrapper
.find(".item")
.at(0)
.find("img").length > 0
).toEqual(true);
});
it("should render all links", () => {
const wrapper = mount(<Root>{getElement()}</Root>);
const links = wrapper.find("a").map((node) => node.text());
const items = _.map(DASHBOARDITEMS, _.property("content"));
expect(links).toEqual(items);
});
})
);
return getElement();
});

Answer 1

Okay so I seemed to figure out what was wrong the whole time.
A very stupid mistake by me but I hope it helps anyone who is dealing with same issue.
I checked the console and seems like the fourth story (in order) that I had written had some error and as soon as I resolved that error that story itself and all other story started showing on storybook.
I upgraded my storybook version and seems like all the stories are shown on the UI with errors.