@kiwicom/smart-faq/src/SmartFAQ/common/__tests__/Responsive.test.js

/**
 * @jest-environment node
 * @flow
 */

import * as React from 'react';
import ReactDOMServer from 'react-dom/server';

import Contexts from '../../../shared/ssr/Contexts';
import { FullPageVersion } from '../PageVariant';
import { Desktop } from '../Responsive';

const FakeComponent = () => <div>Hello World!</div>;

// Simulate SSR environment
const CreateContext = ({ screenWidthFallback }) => {
  const GeneratedComponent = () => (
    <Contexts
      location=""
      lng="en"
      userContext={{}}
      theme={{}}
      currencyId=""
      countries={{}}
      brand={{}}
      language={{}}
      fetched={{}}
      intl={{}}
      ip=""
      screenWidthFallback={screenWidthFallback}
    >
      <FullPageVersion>
        <Desktop>
          <FakeComponent />
        </Desktop>
      </FullPageVersion>
    </Contexts>
  );
  return GeneratedComponent;
};

describe('Guess page width in SSR', () => {
  it('should render fullpage version desktop component on desktop', () => {
    const Component = CreateContext({ screenWidthFallback: 1280 });
    const wrapper = ReactDOMServer.renderToString(<Component />);

    expect(wrapper).toEqual('<div>Hello World!</div>');
  });

  it('should not render fullpage version desktop component on mobile', () => {
    const Component = CreateContext({ screenWidthFallback: 320 });
    const wrapper = ReactDOMServer.renderToString(<Component />);

    expect(wrapper).toEqual('');
  });
});