Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove react-select from kibana #18876

Merged
merged 22 commits into from
May 30, 2018
Merged

Conversation

nreese
Copy link
Contributor

@nreese nreese commented May 7, 2018

Replace react-select with EuiComboBox in TSVB

screen shot 2018-05-07 at 1 42 35 pm

@nreese nreese added the chore label May 7, 2018
@nreese nreese force-pushed the remove_react_select branch from d6967b4 to 742f1a0 Compare May 7, 2018 19:12
@nreese
Copy link
Contributor Author

nreese commented May 7, 2018

cc @simianhacker

@nreese nreese added the Feature:Visualizations Generic visualization features (in case no more specific feature label is available) label May 7, 2018
@elasticmachine
Copy link
Contributor

💔 Build Failed

@elasticmachine
Copy link
Contributor

💔 Build Failed

@nreese nreese force-pushed the remove_react_select branch from 9c849d4 to fa629f3 Compare May 8, 2018 19:51
@nreese nreese changed the title Remove react select from TSVB Remove react-select from kibana May 8, 2018
@elasticmachine
Copy link
Contributor

💔 Build Failed

@nreese nreese force-pushed the remove_react_select branch from 7d39e77 to 9a450dc Compare May 10, 2018 12:10
@elasticmachine
Copy link
Contributor

💚 Build Succeeded

@nreese nreese requested review from timroes and stacey-gammon May 10, 2018 13:49
@nreese nreese force-pushed the remove_react_select branch from 344884d to b82070b Compare May 14, 2018 14:42
@elasticmachine
Copy link
Contributor

💔 Build Failed

@nreese nreese force-pushed the remove_react_select branch from b82070b to 1e07f0f Compare May 16, 2018 14:55
@elasticmachine
Copy link
Contributor

💚 Build Succeeded

@stacey-gammon
Copy link
Contributor

I find EuiComboBox a bit weird when there is only one value allowed in it. Maybe a separate clean up that could be done in EUI directly...

Hitting the (x) doesn't clear the field for Aggregation and Group By but does for Field, some others under Panel Options too. If they shouldn't be clearable, can we get rid of the x?:

screen shot 2018-05-16 at 2 52 10 pm

@stacey-gammon
Copy link
Contributor

I wish we had better tests for TSVB stuff, most of these calculations mean nothing to me so I can only compare against existing version.

Anyway, I think I notice something that changed and is wrong in this version. The Separate axis part of Options doesn't seem to be working right. If you turn it on, it changes the value of the axis, and also the left/right selection doesn't seem to actually change where the values are:

screen shot 2018-05-16 at 3 14 20 pm

screen shot 2018-05-16 at 3 14 25 pm

screen shot 2018-05-16 at 3 14 35 pm

if (pipeline) {
note = (
<span className="vis_editor__agg_select-note">
(requires child aggregation)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like this isn't migrated to the new code. We okay with that? I'd say the pros far outweigh the cons on losing this little help text, just want to point it out.

options={durationOutputOptions}
<EuiComboBox
isClearable={false}
options={durationInputOptions}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Any reason why you changed this from outputOptions to inputOptions? Looks like previously we didn't want pico,nano or micro as an output option (no idea why...)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This was removed by accident. I will replace with the original options list.

@nreese
Copy link
Contributor Author

nreese commented May 16, 2018

Hitting the (x) doesn't clear the field for Aggregation and Group By but does for Field, some others under Panel Options too. If they shouldn't be clearable, can we get rid of the x?

@stacey-gammon That is a bug introduced in the latest version of EUI(elastic/eui#829). I have a PR out that will fix the problem so the x will not be displayed. Once that is merged and there is new version of EUI, this problem will be resolved.

@nreese
Copy link
Contributor Author

nreese commented May 17, 2018

Anyway, I think I notice something that changed and is wrong in this version. The Separate axis part of Options doesn't seem to be working right. If you turn it on, it changes the value of the axis, and also the left/right selection doesn't seem to actually change where the values are

@stacey-gammon Looks like I was not setting isDisabled prop on EuiComboBox in the same places that disabled prop was getting set on Select. I pushed a change to fix that problem. Now the Axis Position input is disabled when it should be and this should fix the problem you were seeing

@elasticmachine
Copy link
Contributor

💔 Build Failed

@nreese
Copy link
Contributor Author

nreese commented May 17, 2018

looks like unrelated functional test error

15:09:39          └- ✖ fail: "timelion app expression typeahead dynamic suggestions for argument values .es() should show field suggestions for split argument when index pattern set"
15:09:39          │          expression typeahead
15:09:39          │            dynamic suggestions for argument values
15:09:39          │              .es()
15:09:39          │                should show field suggestions for split argument when index pattern set:
15:09:39          │        [POST http://localhost:9515/session/807eccf6a1353525d41222716cbae73a/element/0.6224997182903562-38/click] stale element reference: element is not attached to the page document
15:09:39          │         (Session info: chrome=66.0.3359.181)
15:09:39          │         (Driver info: chromedriver=2.36.540471 (9c759b81a907e70363c6312294d30b6ccccc2752),platform=Linux 4.4.0-1057-aws x86_64)
15:09:39          │         at Server._post (test/functional/services/remote/verbose_remote_logging.js:22:21)
15:09:39          │         at runRequest (node_modules/leadfoot/Session.js:92:40)
15:09:39          │         at /var/lib/jenkins/workspace/elastic+kibana+pull-request+multijob-selenium/kibana/node_modules/leadfoot/Session.js:113:39
15:09:39          │         at new Promise (node_modules/dojo/Promise.js:172:17)
15:09:39          │         at Session._post (node_modules/leadfoot/Session.js:67:10)
15:09:39          │         at Element._post (node_modules/leadfoot/Element.js:23:31)
15:09:39          │         at Element.click (node_modules/leadfoot/Element.js:197:15)
15:09:39          │         at TimelionPage.clickSuggestion (test/functional/page_objects/timelion_page.js:54:39)
15:09:39          │         at <anonymous>:null:null

jenkins, test this

@elasticmachine
Copy link
Contributor

💚 Build Succeeded

@nreese nreese force-pushed the remove_react_select branch from b332b5c to bd10dec Compare May 22, 2018 16:31
@elasticmachine
Copy link
Contributor

💚 Build Succeeded

@nreese
Copy link
Contributor Author

nreese commented May 22, 2018

@stacey-gammon I have updated kibana with a new version of EUI that fixes the problems you found. This PR is ready for another look

await input.clearValue();
await input.type(value);
await find.clickByCssSelector('.euiComboBoxOption');
await this.closeComboBoxOptionsList(comboBox);
await remote.pressKeys('\uE004');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎉 I like when we can remove stuff like that :D

@nreese nreese force-pushed the remove_react_select branch from bd10dec to d1c3a2d Compare May 30, 2018 12:02
@elasticmachine
Copy link
Contributor

💔 Build Failed

@nreese
Copy link
Contributor Author

nreese commented May 30, 2018

Looks like unrelated discover test failure

12:46:20        └- ✖ fail: "discover app discover app field data doc view should show oldest time first"
12:46:20        │             Error: expected 'September 22nd 2015, 23:50:13.253\ntype:apache index:logstash-2015.09.22 @timestamp:September 22nd 2015, 23:50:13.253 ip:238.171.34.42 extension:jpg response:200 geo.coordinates:{ "lat": 38.66494528, "lon": -88.45299556 } geo.src:FR geo.dest:KH geo.srcdest:FR:KH @tags:success, info utc_time:September 22nd 2015, 23:50:13.253 referer:http://twitter.com/success/nancy-currie agent:Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322) clientip:238.171.34.42 bytes:7,124 host:media-for-the-masses.theacademyofperformingartsandscience.org request:/uploads/karl-henize.jpg url:https://media-for-the-masses.theacademyofperformingartsandscience.org/uploads/karl-henize.jpg @message:238.171.34.42 - - [2015-09-22T23:50:13.253Z] "GET /uploads/karl-henize.jpg HTTP/1.1" 200 7124 "-" "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322)" spaces:this is a thing with lots of spaces wwwwoooooo xss:<script>console.log("xss")</script> headings:<h3>alexander-viktorenko</h5>, http://nytimes.com/warning/michael-massimino links:@www.slate.com, http://www.slate.com/security/frederick-w-leslie, www.www.slate.com relatedContent:{ "url": "http://www.laweekly.com/music/bjork-at-the-nokia-theatre-12-12-2408191", "og:type": "article", "og:title": "Bjork at the Nokia Theatre, 12/12", "og:description": "Bjork at the Nokia Theater, December 12 By Randall Roberts Last night&rsquo;s Bjork show at the Dystopia &ndash; er, I mean Nokia -- Theatre downtown di...", "og:url": "http://www.laweekly.com/music/bjork-at-the-nokia-theatre-12-12-2408191", "article:published_time": "2007-12-13T12:19:35-08:00", "article:modified_time": "2014-11-27T08:28:42-08:00", "article:section": "Music", "og:image": "http://IMAGES1.laweekly.com/imager/bjork-at-the-nokia-theatre-12-12/u/original/2470701/bjorktn003.jpg", "og:image:height": "334", "og:image:width": "480", "og:site_name": "LA Weekly", "twitter:title": "Bjork at the Nokia Theatre, 12/12", "twitter:description": "Bjork at the Nokia Theater, December 12 By Randall Roberts Last night&rsquo;s Bjork show at the Dystopia &ndash; er, I mean Nokia -- Theatre downtown di...", "twitter:card": "summary", "twitter:image": "http://IMAGES1.laweekly.com/imager/bjork-at-the-nokia-theatre-12-12/u/original/2470701/bjorktn003.jpg", "twitter:site": "@laweekly" }, { "url": "http://www.laweekly.com/music/the-rapture-at-the-mayan-7-25-2401011", "og:type": "article", "og:title": "The Rapture at the Mayan, 7/25", "og:description": "If you haven&rsquo;t yet experienced the phenomenon of people walk-dancing, apparently the best place to witness this is at a Rapture show. Here&rsquo;s...", "og:url": "http://www.laweekly.com/music/the-rapture-at-the-mayan-7-25-2401011", "article:published_time": "2007-07-26T12:42:30-07:00", "article:modified_time": "2014-11-27T08:00:51-08:00", "article:section": "Music", "og:image": "http://IMAGES1.laweekly.com/imager/the-rapture-at-the-mayan-7-25/u/original/2463272/rapturetn05.jpg", "og:image:height": "321", "og:image:width": "480", "og:site_name": "LA Weekly", "twitter:title": "The Rapture at the Mayan, 7/25", "twitter:description": "If you haven&rsquo;t yet experienced the phenomenon of people walk-dancing, apparently the best place to witness this is at a Rapture show. Here&rsquo;s...", "twitter:card": "summary", "twitter:image": "http://IMAGES1.laweekly.com/imager/the-rapture-at-the-mayan-7-25/u/original/2463272/rapturetn05.jpg", "twitter:site": "@laweekly" } machine.os:win 7 machine.ram:7,516,192,768 _id:AU_x3_g4GFA8no6QjkYX _type:doc _index:logstash-2015.09.22 _score: - relatedContent.article:modified_time:November 26th 2014, 03:39:26.000, November 26th 2014, 04:36:10.000 relatedContent.article:published_time:October 17th 2005, 07:10:18.000, October 17th 2005, 07:10:18.000' to equal 'September 22nd 2015, 23:50:13.253\ntype:apache index:logstash-2015.09.22 @timestamp:September 22nd 2015, 23:50:13.253 ip:238.171.34.42 extension:jpg response:200 geo.coordinates:{ "lat": 38.66494528, "lon": -88.45299556 } geo.src:FR geo.dest:KH geo.srcdest:FR:KH @tags:success, info utc_time:September 22nd 2015, 23:50:13.253 referer:http://twitter.com/success/nancy-currie agent:Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322) clientip:238.171.34.42 bytes:7,124 host:media-for-the-masses.theacademyofperformingartsandscience.org request:/uploads/karl-henize.jpg url:https://media-for-the-masses.theacademyofperformingartsandscience.org/uploads/karl-henize.jpg @message:238.171.34.42 - - [2015-09-22T23:50:13.253Z] "GET /uploads/karl-henize.jpg HTTP/1.1" 200 7124 "-" "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322)" spaces:this is a thing with lots of spaces wwwwoooooo xss:<script>console.log("xss")</script> headings:<h3>alexander-viktorenko</h5>, http://nytimes.com/warning/michael-massimino links:@www.slate.com, http://www.slate.com/security/frederick-w-leslie, www.www.slate.comrelatedContent:{ "url": "http://www.laweekly.com/music/bjork-at-the-nokia-theatre-12-12-2408191", "og:type": "article", "og:title": "Bjork at the Nokia Theatre, 12/12", "og:description": "Bjork at the Nokia Theater, December 12 By Randall Roberts Last night&rsquo;s Bjork show at the Dystopia &ndash; er, I mean Nokia -- Theatre downtown di...", "og:url": "http://www.laweekly.com/music/bjork-at-the-nokia-theatre-12-12-2408191", "article:published_time": "2007-12-13T12:19:35-08:00", "article:modified_time": "2014-11-27T08:28:42-08:00", "article:section": "Music", "og:image": "http://IMAGES1.laweekly.com/imager/bjork-at-the-nokia-theatre-12-12/u/original/2470701/bjorktn003.jpg", "og:image:height": "334", "og:image:width": "480", "og:site_name": "LA Weekly", "twitter:title": "Bjork at the Nokia Theatre, 12/12", "twitter:description": "Bjork at the Nokia Theater, December 12 By Randall Roberts Last night&rsquo;s Bjork show at the Dystopia &ndash; er, I mean Nokia -- Theatre downtown di...", "twitter:card": "summary", "twitter:image": "http://IMAGES1.laweekly.com/imager/bjork-at-the-nokia-theatre-12-12/u/original/2470701/bjorktn003.jpg", "twitter:site": "@laweekly" }, { "url": "http://www.laweekly.com/music/the-rapture-at-the-mayan-7-25-2401011", "og:type": "article", "og:title": "The Rapture at the Mayan, 7/25", "og:description": "If you haven&rsquo;t yet experienced the phenomenon of people walk-dancing, apparently the best place to witness this is at a Rapture show. Here&rsquo;s...", "og:url": "http://www.laweekly.com/music/the-rapture-at-the-mayan-7-25-2401011", "article:published_time": "2007-07-26T12:42:30-07:00", "article:modified_time": "2014-11-27T08:00:51-08:00", "article:section": "Music", "og:image": "http://IMAGES1.laweekly.com/imager/the-rapture-at-the-mayan-7-25/u/original/2463272/rapturetn05.jpg", "og:image:height": "321", "og:image:width": "480", "og:site_name": "LA Weekly", "twitter:title": "The Rapture at the Mayan, 7/25", "twitter:description": "If you haven&rsquo;t yet experienced the phenomenon of people walk-dancing, apparently the best place to witness this is at a Rapture show. Here&rsquo;s...", "twitter:card": "summary", "twitter:image": "http://IMAGES1.laweekly.com/imager/the-rapture-at-the-mayan-7-25/u/original/2463272/rapturetn05.jpg", "twitter:site": "@laweekly" } machine.os:win 7 machine.ram:7,516,192,768 _id:AU_x3_g4GFA8no6QjkYX _type:doc _index:logstash-2015.09.22 _score: - relatedContent.article:modified_time:November 27th 2014, 16:00:51.000, November 27th 2014, 16:28:42.000 relatedContent.article:published_time:July 26th 2007, 19:42:30.000, December 13th 2007, 20:19:35.000'

jenkins, test this

@stacey-gammon
Copy link
Contributor

cc @Bargs ^^ looks like that flaky discover test was hit above, if you want to take a look at the debug output.

@timroes
Copy link
Contributor

timroes commented May 30, 2018

Don't worry about that test too much, I removed the test altogether in the Inspector PR already, since it relied on a the spy panel in discover which doesn't exist anymore.

@elasticmachine
Copy link
Contributor

💚 Build Succeeded

@nreese nreese merged commit 8de20f2 into elastic:master May 30, 2018
nreese added a commit to nreese/kibana that referenced this pull request May 30, 2018
* remove react-select from AggSelect

* update field_select to use EuiComboBox

* metric_select

* moving_average

* percentile

* series_agg

* std_deviation

* removing some more react-select instances

* icon_select and group_by_select

* gauge type

* markdown

* set isClearable prop

* remove react-select from timeseries config

* remove react-select from timeseries panel options

* remove react select from terms

* remove react-select from table config

* remove react-select from data_format_picker

* fix create_select_handler mocha test

* remove react-select from kibana

* update tsvb functional tests

* set isDisabled prop on EuiComboBox where disabld prop was set for Select

* use durationOutputOptions for duration 'to' options
nreese added a commit that referenced this pull request May 30, 2018
* remove react-select from AggSelect

* update field_select to use EuiComboBox

* metric_select

* moving_average

* percentile

* series_agg

* std_deviation

* removing some more react-select instances

* icon_select and group_by_select

* gauge type

* markdown

* set isClearable prop

* remove react-select from timeseries config

* remove react-select from timeseries panel options

* remove react select from terms

* remove react-select from table config

* remove react-select from data_format_picker

* fix create_select_handler mocha test

* remove react-select from kibana

* update tsvb functional tests

* set isDisabled prop on EuiComboBox where disabld prop was set for Select

* use durationOutputOptions for duration 'to' options
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
chore Feature:Visualizations Generic visualization features (in case no more specific feature label is available)
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants