Modify tests

Author: Proskynete

__tests__/content-body.spec.js

@@ -11,6 +11,6 @@ describe('Description Component', () => {
   it('should render with text prop and wihtout optional prop', () => {
     const wrapper = shallow(<ContentBody title="2018">Hello World</ContentBody>);
     expect(wrapper.children).to.be.a('function');
-    expect(wrapper.find('.timeline__container__body__title').text()).to.be.equal('2018');
+    expect(wrapper.find('.title-body-component').text()).to.be.equal('2018');
   });
 });

__tests__/content-year.spec.js

@@ -10,6 +10,6 @@ Enzyme.configure({ adapter: new Adapter() });
 describe('Description Component', () => {
   it('should render with text prop and wihtout optional prop', () => {
     const wrapper = shallow(<ContentYear year="hello" />);
-    expect(wrapper.find('.timeline__container__year__item').text()).to.be.equal('hello');
+    expect(wrapper.find('.item-year-component').text()).to.be.equal('hello');
   });
 });

__tests__/content.spec.js

@@ -11,6 +11,6 @@ describe('Description Component', () => {
   it('should render with text prop and wihtout optional prop', () => {
     const wrapper = shallow(<Content>Hello World</Content>);
     expect(wrapper.children).to.be.a('function');
-    expect(wrapper.find('.timeline__container').text()).to.be.equal('Hello World');
+    expect(wrapper.find('.content-component').text()).to.be.equal('Hello World');
   });
 });

__tests__/description.spec.js

@@ -10,11 +10,11 @@ Enzyme.configure({ adapter: new Adapter() });
 describe('Description Component', () => {
   it('should render with text prop and wihtout optional prop', () => {
     const wrapper = shallow(<Description text="hello" />);
-    expect(wrapper.find('.timeline__container__body__description__text').text()).to.be.equal('hello');
+    expect(wrapper.find('.text-description-component').text()).to.be.equal('hello');
   });
 
   it('should render with text prop and optional prop', () => {
     const wrapper = shallow(<Description text="hello" optional="world" />);
-    expect(wrapper.find('.timeline__container__body__description__optional').text()).to.be.equal('world');
+    expect(wrapper.find('.optional-description-component').text()).to.be.equal('world');
   });
 });

__tests__/timeline.spec.js

@@ -11,6 +11,6 @@ describe('Timeline Component', () => {
   it('should render with children', () => {
     const wrapper = shallow(<Timeline>Hello</Timeline>);
     expect(wrapper.children).to.be.a('function');
-    expect(wrapper.find('.timeline').text()).to.be.equal('Hello');
+    expect(wrapper.find('.timeline-component').text()).to.be.equal('Hello');
   });
 });

build/index.js

@@ -12,7 +12,8 @@
   "scripts": {
     "build": "webpack --mode production",
     "lint": "npm run lint:js",
-    "lint:js": "eslint ./src/components/ --ignore-path .gitignore --fix",
+    "lint:js": "eslint ./src/components/ --ignore-path .gitignore",
+    "lint:js-fix": "eslint ./src/components/ --ignore-path .gitignore --fix",
     "start": "webpack --mode development --watch",
     "test": "jest",
     "test:coveralls": "jest --coverage --coverageReporters=text-lcov | coveralls",

package.json

@@ -7,7 +7,7 @@ const ContainerComponent = styled.div`
   line-height: 1;
 
   &:last-child {
-    .body-content {
+    .body-component {
         &::before {
           display: none;
         }
@@ -22,7 +22,7 @@ const Content = (props) => {
   } = props;
 
   return (
-    <ContainerComponent>
+    <ContainerComponent className="content-component">
       { children }
     </ContainerComponent>
   );

src/components/content/index.js

@@ -39,8 +39,8 @@ const ContentBody = (props) => {
   } = props;
 
   return (
-    <BodyComponent className="body-content">
-      <BodyComponentTitle>
+    <BodyComponent className="body-component">
+      <BodyComponentTitle className="title-body-component">
         { title }
       </BodyComponentTitle>
       { children }

src/components/content_body/index.js

@@ -32,8 +32,8 @@ const ContentYear = (props) => {
   } = props;
 
   return (
-    <YearComponent>
-      <YearComponentItem>
+    <YearComponent className="year-component">
+      <YearComponentItem className="item-year-component">
         { year }
       </YearComponentItem>
     </YearComponent>