--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2019 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
+ */
+type AutoSizerProps = {
+ children: (props: AutoSizerChildProps) => React.ReactNode;
+ disableHeight?: boolean;
+ disableWidth?: boolean;
+};
+type AutoSizerChildProps = { height?: number; width?: number };
+
+function AutoSizer({ children, disableHeight, disableWidth }: AutoSizerProps) {
+ const props: AutoSizerChildProps = {};
+ if (!disableHeight) {
+ props.height = 200;
+ }
+ if (!disableWidth) {
+ props.width = 200;
+ }
+ return children(props);
+}
+
+module.exports = { AutoSizer };
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2019 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
+ */
+type WindowScrollerProps = {
+ children: (params: WindowScrollerChildProps) => React.ReactNode;
+};
+type WindowScrollerChildProps = {
+ height: number;
+ isScrolling: boolean;
+ scrollTop: number;
+ onChildScroll: (params: { scrollTop: number }) => void;
+};
+
+function WindowScroller({ children }: WindowScrollerProps) {
+ const props: WindowScrollerChildProps = {
+ height: 200,
+ isScrolling: false,
+ scrollTop: 0,
+ onChildScroll: () => {}
+ };
+ return children(props);
+}
+
+module.exports = { WindowScroller };
<div
className="project-activity-graph"
>
- <AutoSizer
- disableHeight={false}
- disableWidth={false}
- onResize={[Function]}
- style={Object {}}
- >
+ <AutoSizer>
<Component />
</AutoSizer>
</div>
import { AutoSizer } from 'react-virtualized/dist/commonjs/AutoSizer';
import { List, ListRowProps } from 'react-virtualized/dist/commonjs/List';
import { WindowScroller } from 'react-virtualized/dist/commonjs/WindowScroller';
+import { translate } from 'sonar-ui-common/helpers/l10n';
import { OnboardingContext } from '../../../app/components/OnboardingContext';
import EmptySearch from '../../../components/common/EmptySearch';
import { Query } from '../query';
const project = this.props.projects[index];
const height = this.getCardHeight();
return (
- <div key={key} style={{ ...style, height }}>
- <ProjectCard
- currentUser={this.props.currentUser}
- handleFavorite={this.props.handleFavorite}
- height={height}
- key={project.key}
- organization={this.props.organization}
- project={project}
- type={this.props.cardType}
- />
+ <div key={key} role="row" style={{ ...style, height }}>
+ <div role="gridcell">
+ <ProjectCard
+ currentUser={this.props.currentUser}
+ handleFavorite={this.props.handleFavorite}
+ height={height}
+ key={project.key}
+ organization={this.props.organization}
+ project={project}
+ type={this.props.cardType}
+ />
+ </div>
</div>
);
};
{({ width }) => (
<div>
<List
+ aria-label={translate('project_plural')}
autoHeight={true}
height={height}
isScrolling={isScrolling}
*/
import { shallow } from 'enzyme';
import * as React from 'react';
+import { ListRowProps } from 'react-virtualized';
+import { AutoSizer } from 'react-virtualized/dist/commonjs/AutoSizer';
+import { WindowScroller } from 'react-virtualized/dist/commonjs/WindowScroller';
import ProjectsList from '../ProjectsList';
-it('renders', () => {
- expect(shallowRender()).toMatchSnapshot();
+jest.mock('react-virtualized/dist/commonjs/AutoSizer');
+jest.mock('react-virtualized/dist/commonjs/WindowScroller');
+
+it('renders correctly', () => {
+ const wrapper = shallowRender();
+ expect(
+ wrapper
+ .find(WindowScroller)
+ .dive()
+ .find(AutoSizer)
+ .dive()
+ ).toMatchSnapshot('list element');
+
+ expect(
+ wrapper.instance().renderRow({ index: 0, key: 'foo-key', style: {} } as ListRowProps)
+ ).toMatchSnapshot('row element');
});
it('renders different types of "no projects"', () => {
});
function shallowRender(props?: any) {
- return shallow(
+ return shallow<ProjectsList>(
<ProjectsList
cardType="overall"
currentUser={{ isLoggedIn: true }}
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`renders 1`] = `
+exports[`renders correctly: list element 1`] = `
+<div>
+ <List
+ aria-label="project_plural"
+ autoHeight={true}
+ estimatedRowSize={30}
+ height={200}
+ isScrolling={false}
+ noRowsRenderer={[Function]}
+ onRowsRendered={[Function]}
+ onScroll={[Function]}
+ overscanIndicesGetter={[Function]}
+ overscanRowCount={2}
+ rowCount={2}
+ rowHeight={163}
+ rowRenderer={[Function]}
+ scrollToAlignment="auto"
+ scrollToIndex={-1}
+ scrollTop={0}
+ style={
+ Object {
+ "outline": "none",
+ }
+ }
+ width={200}
+ />
+</div>
+`;
+
+exports[`renders correctly: row element 1`] = `
<div
- className="projects-list"
+ role="row"
+ style={
+ Object {
+ "height": 143,
+ }
+ }
>
- <WindowScroller
- onResize={[Function]}
- onScroll={[Function]}
- scrollElement={[Window]}
- scrollingResetTimeInterval={150}
- serverHeight={0}
- serverWidth={0}
+ <div
+ role="gridcell"
>
- <Component />
- </WindowScroller>
+ <ProjectCard
+ currentUser={
+ Object {
+ "isLoggedIn": true,
+ }
+ }
+ height={143}
+ project={
+ Object {
+ "key": "foo",
+ "name": "Foo",
+ }
+ }
+ type="overall"
+ />
+ </div>
</div>
`;