Skip to content

Commit

Permalink
fix(backend): Replaced the XGBoost sample. Fixes #5089 (#5100)
Browse files Browse the repository at this point in the history
* Revert "fix(samples): Remove broken xgboost sample (#5091)"

This reverts commit 1dcda80.

* fix(backend): Replaced the XGBoost sample

* Fixed the backend image build

* Updated the frontend tests
  • Loading branch information
Ark-kun authored and chensun committed Feb 12, 2021
1 parent 7276711 commit 8e648a6
Show file tree
Hide file tree
Showing 7 changed files with 276 additions and 235 deletions.
2 changes: 1 addition & 1 deletion backend/Dockerfile
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ RUN set -e; \
pipeline_py="${pipeline_yaml%.yaml}"; \
mv "$pipeline_py" "${pipeline_py}.tmp"; \
echo 'import kfp; kfp.components.default_base_image_or_builder="gcr.io/google-appengine/python:2020-03-31-141326"' | cat - "${pipeline_py}.tmp" > "$pipeline_py"; \
python3 "$pipeline_py"; \
dsl-compile --py "$pipeline_py" --output "$pipeline_yaml" || python3 "$pipeline_py"; \
done

# 3. Start api web server
Expand Down
5 changes: 5 additions & 0 deletions backend/src/apiserver/config/sample_config.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,9 @@
[
{
"name": "[Demo] XGBoost - Iterative model training",
"description": "[source code](https://github.com/kubeflow/pipelines/blob/master/samples/core/train_until_good/train_until_good.py) This sample demonstrates iterative training using a train-eval-check recursive loop. The main pipeline trains the initial model and then gradually trains the model some more until the model evaluation metrics are good enough.",
"file": "/samples/core/train_until_good/train_until_good.py.yaml"
},
{
"name": "[Demo] TFX - Taxi tip prediction model trainer",
"description": "[source code](https://github.com/kubeflow/pipelines/tree/master/samples/core/parameterized_tfx_oss) [GCP Permission requirements](https://github.com/kubeflow/pipelines/blob/master/samples/core/parameterized_tfx_oss#permission). Example pipeline that does classification with model analysis based on a public tax cab dataset.",
Expand Down
1 change: 1 addition & 0 deletions frontend/src/config/sample_config_from_backend.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
[
"[Demo] XGBoost - Iterative model training",
"[Demo] TFX - Taxi tip prediction model trainer",
"[Demo] TFX - Iris classification pipeline",
"[Tutorial] Data passing in python components",
Expand Down
257 changes: 28 additions & 229 deletions frontend/src/pages/GettingStarted.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -46,181 +46,7 @@ describe('GettingStarted page', () => {

it('initially renders documentation', () => {
const { container } = render(<GettingStarted {...generateProps()} />);
expect(container).toMatchInlineSnapshot(`
<div>
<div
class="page kfp-start-page"
>
<div>
<br />
<h2
id="build-your-own-pipeline-with"
>
Build your own pipeline with
</h2>
<ul>
<li>
TensorFlow Extended (TFX)
<a
class="link"
href="https://www.tensorflow.org/tfx/guide"
rel="noopener"
target="_blank"
>
SDK
</a>
with end-to-end ML Pipeline Template (
<a
class="link"
href="https://console.cloud.google.com/mlengine/notebooks/deploy-notebook?q=download_url%3Dhttps%253A%252F%252Fraw.githubusercontent.com%252Ftensorflow%252Ftfx%252Fmaster%252Fdocs%252Ftutorials%252Ftfx%252Ftemplate.ipynb"
rel="noopener"
target="_blank"
>
Open TF 2.1 Notebook
</a>
)
</li>
<li>
Kubeflow Pipelines
<a
class="link"
href="https://www.kubeflow.org/docs/pipelines/sdk/"
rel="noopener"
target="_blank"
>
SDK
</a>
</li>
</ul>
<br />
<h2
id="demonstrations-and-tutorials"
>
Demonstrations and Tutorials
</h2>
<p>
This section contains demo and tutorial pipelines.
</p>
<p>
<strong>
Demos
</strong>
- Try an end-to-end demonstration pipeline.
</p>
<ul>
<li>
<a
class="link"
href="#/pipelines"
>
TFX pipeline demo with Keras
</a>
<ul>
<li>
Classification pipeline based on Keras.
<a
class="link"
href="https://github.com/kubeflow/pipelines/tree/master/samples/core/iris"
rel="noopener"
target="_blank"
>
source code
</a>
</li>
</ul>
</li>
<li>
<a
class="link"
href="#/pipelines"
>
TFX pipeline demo with Estimator
</a>
<ul>
<li>
Classification pipeline with model analysis, based on a public BigQuery dataset of taxicab trips.
<a
class="link"
href="https://github.com/kubeflow/pipelines/tree/master/samples/core/parameterized_tfx_oss"
rel="noopener"
target="_blank"
>
source code
</a>
</li>
</ul>
</li>
</ul>
<br />
<p>
<strong>
Tutorials
</strong>
- Learn pipeline concepts by following a tutorial.
</p>
<ul>
<li>
<a
class="link"
href="#/pipelines"
>
Data passing in python components
</a>
<ul>
<li>
Shows how to pass data between python components.
<a
class="link"
href="https://github.com/kubeflow/pipelines/tree/master/samples/tutorials/Data%20passing%20in%20python%20components"
rel="noopener"
target="_blank"
>
source code
</a>
</li>
</ul>
</li>
<li>
<a
class="link"
href="#/pipelines"
>
DSL - Control structures
</a>
<ul>
<li>
Shows how to use conditional execution and exit handlers.
<a
class="link"
href="https://github.com/kubeflow/pipelines/tree/master/samples/tutorials/DSL%20-%20Control%20structures"
rel="noopener"
target="_blank"
>
source code
</a>
</li>
</ul>
</li>
</ul>
<p>
Want to learn more?
<a
class="link"
href="https://www.kubeflow.org/docs/pipelines/tutorials/"
rel="noopener"
target="_blank"
>
Learn from sample and tutorial pipelines.
</a>
</p>
</div>
</div>
</div>
`);
expect(container).toMatchSnapshot();
});

it('renders documentation with pipeline deep link after querying demo pipelines', async () => {
Expand All @@ -235,34 +61,7 @@ describe('GettingStarted page', () => {
const { container } = render(<GettingStarted {...generateProps()} />);
const base = container.innerHTML;
await TestUtils.flushPromises();
expect(pipelineListSpy.mock.calls).toMatchInlineSnapshot(`
Array [
Array [
undefined,
10,
undefined,
"%7B%22predicates%22%3A%5B%7B%22key%22%3A%22name%22%2C%22op%22%3A%22EQUALS%22%2C%22string_value%22%3A%22%5BDemo%5D%20TFX%20-%20Taxi%20tip%20prediction%20model%20trainer%22%7D%5D%7D",
],
Array [
undefined,
10,
undefined,
"%7B%22predicates%22%3A%5B%7B%22key%22%3A%22name%22%2C%22op%22%3A%22EQUALS%22%2C%22string_value%22%3A%22%5BDemo%5D%20TFX%20-%20Iris%20classification%20pipeline%22%7D%5D%7D",
],
Array [
undefined,
10,
undefined,
"%7B%22predicates%22%3A%5B%7B%22key%22%3A%22name%22%2C%22op%22%3A%22EQUALS%22%2C%22string_value%22%3A%22%5BTutorial%5D%20Data%20passing%20in%20python%20components%22%7D%5D%7D",
],
Array [
undefined,
10,
undefined,
"%7B%22predicates%22%3A%5B%7B%22key%22%3A%22name%22%2C%22op%22%3A%22EQUALS%22%2C%22string_value%22%3A%22%5BTutorial%5D%20DSL%20-%20Control%20structures%22%7D%5D%7D",
],
]
`);
expect(pipelineListSpy.mock.calls).toMatchSnapshot();
expect(diffHTML({ base, update: container.innerHTML })).toMatchInlineSnapshot(`
Snapshot Diff:
- Expected
Expand All @@ -275,7 +74,7 @@ describe('GettingStarted page', () => {
<ul>
<li>
- <a href="#/pipelines" class="link">TFX pipeline demo with Keras</a>
+ <a href="#/pipelines/details/pipeline-id-2?" class="link"
+ <a href="#/pipelines/details/pipeline-id-3?" class="link"
+ >TFX pipeline demo with Keras</a
+ >
<ul>
Expand All @@ -290,44 +89,44 @@ describe('GettingStarted page', () => {
</li>
<li>
- <a href="#/pipelines" class="link">TFX pipeline demo with Estimator</a>
+ <a href="#/pipelines/details/pipeline-id-1?" class="link"
+ <a href="#/pipelines/details/pipeline-id-2?" class="link"
+ >TFX pipeline demo with Estimator</a
+ >
<ul>
<li>
Classification pipeline with model analysis, based on a public
BigQuery dataset of taxicab trips.
<a
@@ --- --- @@
>
</li>
</ul>
</li>
<li>
- <a href="#/pipelines" class="link">XGBoost Pipeline demo</a>
+ <a href="#/pipelines/details/pipeline-id-1?" class="link"
+ >XGBoost Pipeline demo</a
+ >
<ul>
<li>
An example of end-to-end iterative XGBoost model training.
<a
href="https://github.com/kubeflow/pipelines/tree/master/samples/core/train_until_good"
@@ --- --- @@
<strong>Tutorials</strong> - Learn pipeline concepts by following a
tutorial.
</p>
<ul>
<li>
- <a href="#/pipelines" class="link">Data passing in python components</a>
+ <a href="#/pipelines/details/pipeline-id-3?" class="link"
+ <a href="#/pipelines/details/pipeline-id-4?" class="link"
+ >Data passing in python components</a
+ >
<ul>
<li>
Shows how to pass data between python components.
<a
href="https://github.com/kubeflow/pipelines/tree/master/samples/tutorials/Data%20passing%20in%20python%20components"
@@ --- --- @@
>
</li>
</ul>
</li>
<li>
- <a href="#/pipelines" class="link">DSL - Control structures</a>
+ <a href="#/pipelines/details/pipeline-id-4?" class="link"
+ >DSL - Control structures</a
+ >
<ul>
<li>
Shows how to use conditional execution and exit handlers.
<a
href="https://github.com/kubeflow/pipelines/tree/master/samples/tutorials/DSL%20-%20Control%20structures"
`);
});

Expand Down Expand Up @@ -360,20 +159,20 @@ describe('GettingStarted page', () => {
+ Received
@@ --- --- @@
>
</li>
</ul>
</li>
<strong>Tutorials</strong> - Learn pipeline concepts by following a
tutorial.
</p>
<ul>
<li>
- <a href="#/pipelines" class="link">DSL - Control structures</a>
- <a href="#/pipelines" class="link">Data passing in python components</a>
+ <a href="#/pipelines/details/pipeline-id-4?" class="link"
+ >DSL - Control structures</a
+ >Data passing in python components</a
+ >
<ul>
<li>
Shows how to use conditional execution and exit handlers.
Shows how to pass data between python components.
<a
href="/kubeflow/pipelines/tree/master/samples/tutorials/DSL%20-%20Control%20structures"
href="/kubeflow/pipelines/tree/master/samples/tutorials/Data%20passing%20in%20python%20components"
`);
});
});
15 changes: 10 additions & 5 deletions frontend/src/pages/GettingStarted.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,24 +27,27 @@ import { Apis } from '../lib/Apis';
import Buttons from '../lib/Buttons';
import { Page } from './Page';

const DEMO_PIPELINES: string[] = SAMPLE_CONFIG;
const DEMO_PIPELINES: string[] = SAMPLE_CONFIG.slice(0, 4);
const DEMO_PIPELINES_ID_MAP = {
control: 3,
data: 2,
tfxKeras: 1,
tfx: 0,
control: 4,
data: 3,
tfxKeras: 2,
tfx: 1,
xgboost: 0,
};

const PAGE_CONTENT_MD = ({
control,
data,
tfxKeras,
tfx,
xgboost,
}: {
control: string;
data: string;
tfxKeras: string;
tfx: string;
xgboost: string;
}) => `
<br/>
Expand All @@ -62,6 +65,7 @@ This section contains demo and tutorial pipelines.
* [TFX pipeline demo with Keras](${tfxKeras}) - Classification pipeline based on Keras. [source code](https://github.com/kubeflow/pipelines/tree/master/samples/core/iris)
* [TFX pipeline demo with Estimator](${tfx}) - Classification pipeline with model analysis, based on a public BigQuery dataset of taxicab trips. [source code](https://github.com/kubeflow/pipelines/tree/master/samples/core/parameterized_tfx_oss)
* [XGBoost Pipeline demo](${xgboost}) - An example of end-to-end iterative XGBoost model training. [source code](https://github.com/kubeflow/pipelines/tree/master/samples/core/train_until_good)
<br/>
Expand Down Expand Up @@ -147,6 +151,7 @@ export class GettingStarted extends Page<{}, { links: string[] }> {
data: this.state.links[DEMO_PIPELINES_ID_MAP.data],
tfxKeras: this.state.links[DEMO_PIPELINES_ID_MAP.tfxKeras],
tfx: this.state.links[DEMO_PIPELINES_ID_MAP.tfx],
xgboost: this.state.links[DEMO_PIPELINES_ID_MAP.xgboost],
})}
</Markdown>
</div>
Expand Down
Loading

0 comments on commit 8e648a6

Please sign in to comment.