react-slingshot icon indicating copy to clipboard operation
react-slingshot copied to clipboard

react-slingshot does not work properly with material-ui-pickers

Open chenop opened this issue 7 years ago • 0 comments

Describe the bug Its seems there is an issue with DatePicker component of material-ui-picker - does not reproduce with create-react-app

To Reproduce

Tech Version
material-ui-pickers ^1.0.0-rc.9
material-ui 1.0.0-rc.1
React 16.3.1
Browser Chrome
Platform Windows

Steps to reproduce

  1. install fresh installation of react-slingshot
  2. Add empty App.scss to styles directory
  3. Paste the following code to index.js
/* eslint-disable import/default */

import {render} from 'react-dom';
import configureStore, {history} from './store/configureStore';
import './styles/styles.scss'; // Yep, that's right. You can import SASS/CSS files too! Webpack will run the associated loader and plug this into the page.
import React, {Component} from "react";
import {DatePicker, MuiPickersUtilsProvider} from "material-ui-pickers";
import MomentUtils from 'material-ui-pickers/utils/moment-utils';
import CSSModules from "react-css-modules";
import styles from "./styles/App.scss";

require('./favicon.ico'); // Tell webpack to load favicon.ico
const store = configureStore();

class HOCAppContainer extends Component {
  render() {
    return (
      <MuiPickersUtilsProvider utils={MomentUtils}>
        HOC
        <DatePicker />
      </MuiPickersUtilsProvider>
    );
  }
}

const AppContainer = CSSModules(HOCAppContainer, styles);

render(
  <AppContainer />,
  document.getElementById('app')
);

if (module.hot) {
  module.hot.accept('./components/Root', () => {
    const NewRoot = require('./components/Root').default;
    render(
      <AppContainer>
        <NewRoot store={store} history={history} />
      </AppContainer>,
      document.getElementById('app')
    );
  });
}
  1. run:

npm start

  1. open localhost --> Open DatePicker --> click the one of the dates --> it "jump" back to the initial date

Expected behavior The selection should stay on the selected day Note: it reproduce only with react-slingshot

Actual behavior The selection "jump" back to the initial selection

Screenshots

Desktop (please complete the following information):

  • OS: Windows
  • Browser Chrome
  • Version 67

Additional context Could not upload react-slingshot to live example but created the repository with everything above https://github.com/chenop/react-slingshot-material-ui-picker

chenop avatar May 25 '18 08:05 chenop