From 6fb2721294f5d25edb76cb6f9b34eb3e07212950 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 11 Jan 2019 14:20:56 +0100 Subject: Fix copy and links --- packages/dev-tools-pages/ts/pages/compiler.tsx | 20 ++++++++---- packages/dev-tools-pages/ts/pages/coverage.tsx | 42 +++++++++++++++++--------- packages/dev-tools-pages/ts/pages/profiler.tsx | 36 +++++++++++++++------- packages/dev-tools-pages/ts/pages/trace.tsx | 36 +++++++++++++++------- 4 files changed, 92 insertions(+), 42 deletions(-) (limited to 'packages/dev-tools-pages/ts/pages') diff --git a/packages/dev-tools-pages/ts/pages/compiler.tsx b/packages/dev-tools-pages/ts/pages/compiler.tsx index 93a667562..0468fd84f 100644 --- a/packages/dev-tools-pages/ts/pages/compiler.tsx +++ b/packages/dev-tools-pages/ts/pages/compiler.tsx @@ -24,6 +24,9 @@ const Animation = Loadable({ }, }); +const SOLIDITY_INPUT_FORMAT_DOCS = + 'https://solidity.readthedocs.io/en/v0.4.24/using-the-compiler.html#compiler-input-and-output-json-description'; + const Compiler: React.StatelessComponent<{}> = () => ( @@ -74,15 +77,19 @@ const Compiler: React.StatelessComponent<{}> = () => ( - Sol compiler uses solidity standard JSON output format for the artifacts. This way, you can define - which parts of the artifact you need. + Sol compiler uses{' '} + + Solidity standard JSON input format + {' '} + to specify what to include in the generated artifacts. This way, you have complete flexibility on + what is included.

- Sol compiler uses solidity standard JSON output format for the artifacts. This way, you can define - which parts of the artifact you need. + In production, you want to optimize for a small bundle size, so your compiler.json config would + instruct sol-compiler to only output the contract ABI.

@@ -109,8 +116,9 @@ const Compiler: React.StatelessComponent<{}> = () => (

- Sometimes you need to use some debuggers or other dev tools and you’ll need more info in the - artifact. + In development, you need to use profiler and other dev tools that require more information from the + artifact. To do this, you can specify that the artifact also contain the bytecode, deployed bytecode + and source maps.

diff --git a/packages/dev-tools-pages/ts/pages/coverage.tsx b/packages/dev-tools-pages/ts/pages/coverage.tsx index cf759c712..de03d3a9c 100644 --- a/packages/dev-tools-pages/ts/pages/coverage.tsx +++ b/packages/dev-tools-pages/ts/pages/coverage.tsx @@ -33,9 +33,9 @@ const Coverage: React.StatelessComponent<{}> = () => (

- When it comes to writing smart contracts, testing is one of the most important steps of the process. - In order to quantify the robustness of your Solidity testing suite, you need to measure its code - coverage. + When it comes to writing secure smart contracts, testing is one of the most important steps in the + process. In order to quantify the robustness of your Solidity testing suite, you need to measure its + code coverage.

@@ -69,10 +69,17 @@ const Coverage: React.StatelessComponent<{}> = () => ( - Use ganache-cli as a backing node. + Use{' '} + + ganache-cli + {' '} + as a backing node. - Understand and use web3-provider-engine. + Understand and use{' '} + + web3-provider-engine + . @@ -82,11 +89,18 @@ const Coverage: React.StatelessComponent<{}> = () => (

- Sol-coverage is a subprovider that needs to be prepended to your provider engine. - Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-coverage ships - with the SolCompilerArtifactAdapter for use with{' '} - Sol-compiler and TruffleArtifactAdapter for use with the{' '} - Truffle framework. You can also write your own and support any artifact format. + Sol-coverage is a subprovider that needs to be prepended to your{' '} + + provider engine + . Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-coverage + ships with the SolCompilerArtifactAdapter for use with{' '} + + Sol-compiler + {' '} + and TruffleArtifactAdapter for use with the{' '} + + Truffle framework + . You can also write your own and support any artifact format.

@@ -118,19 +132,19 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`}

Now that we have an artifactAdapter, we can create a{' '} - RevertTraceSubprovider and append it to our provider engine. + CoverageSubprovider and append it to our provider engine.

{`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine'; -import { RevertTraceSubprovider } from '@0x/sol-coverage'; +import { CoverageSubprovider } from '@0x/sol-coverage'; const defaultFromAddress = "..."; // Some ethereum address with test funds -const revertTraceSubprovider = new RevertTraceSubprovider(artifactAdapter, defaultFromAddress); +const coverageSubprovider = new CoverageSubprovider(artifactAdapter, defaultFromAddress); const providerEngine = new ProviderEngine(); -providerEngine.addProvider(revertTraceSubprovider); +providerEngine.addProvider(coverageSubprovider); providerEngine.addProvider(new RpcSubprovider({rpcUrl: 'http://localhost:8545'})); providerEngine.start();`} diff --git a/packages/dev-tools-pages/ts/pages/profiler.tsx b/packages/dev-tools-pages/ts/pages/profiler.tsx index 16ac9088e..feca368ba 100644 --- a/packages/dev-tools-pages/ts/pages/profiler.tsx +++ b/packages/dev-tools-pages/ts/pages/profiler.tsx @@ -66,10 +66,17 @@ const Profiler: React.StatelessComponent<{}> = () => ( - Use ganache-cli as a backing node. + Use{' '} + + ganache-cli + {' '} + as a backing node. - Understand and use web3-provider-engine. + Understand and use{' '} + + web3-provider-engine + . @@ -79,11 +86,18 @@ const Profiler: React.StatelessComponent<{}> = () => (

- Sol-trace is a subprovider that needs to be prepended to your provider engine. - Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-trace ships - with the SolCompilerArtifactAdapter for use with{' '} - Sol-compiler and TruffleArtifactAdapter for use with the{' '} - Truffle framework. You can also write your own and support any artifact format. + Sol-trace is a subprovider that needs to be prepended to your{' '} + + provider engine + . Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-trace + ships with the SolCompilerArtifactAdapter for use with{' '} + + Sol-compiler + {' '} + and TruffleArtifactAdapter for use with the{' '} + + Truffle framework + . You can also write your own and support any artifact format.

@@ -115,19 +129,19 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`}

Now that we have an artifactAdapter, we can create a{' '} - RevertTraceSubprovider and append it to our provider engine. + ProfilerSubprovider and append it to our provider engine.

{`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine'; -import { RevertTraceSubprovider } from '@0x/sol-coverage'; +import { ProfilerSubprovider } from '@0x/sol-coverage'; const defaultFromAddress = "..."; // Some ethereum address with test funds -const revertTraceSubprovider = new RevertTraceSubprovider(artifactAdapter, defaultFromAddress); +const profilerSubprovider = new ProfilerSubprovider(artifactAdapter, defaultFromAddress); const providerEngine = new ProviderEngine(); -providerEngine.addProvider(revertTraceSubprovider); +providerEngine.addProvider(profilerSubprovider); providerEngine.addProvider(new RpcSubprovider({rpcUrl: 'http://localhost:8545'})); providerEngine.start();`} diff --git a/packages/dev-tools-pages/ts/pages/trace.tsx b/packages/dev-tools-pages/ts/pages/trace.tsx index cc34e0fbe..1fa159461 100644 --- a/packages/dev-tools-pages/ts/pages/trace.tsx +++ b/packages/dev-tools-pages/ts/pages/trace.tsx @@ -36,10 +36,17 @@ const Trace: React.StatelessComponent<{}> = () => ( - Use ganache-cli as a backing node. + Use{' '} + + ganache-cli + {' '} + as a backing node. - Understand and use web3-provider-engine. + Understand and use{' '} + + web3-provider-engine + . @@ -49,11 +56,18 @@ const Trace: React.StatelessComponent<{}> = () => (

- Sol-trace is a subprovider that needs to be prepended to your provider engine. - Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-trace ships - with the SolCompilerArtifactAdapter for use with{' '} - Sol-compiler and TruffleArtifactAdapter for use with the{' '} - Truffle framework. You can also write your own and support any artifact format. + Sol-trace is a subprovider that needs to be prepended to your{' '} + + provider engine + . Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-trace + ships with the SolCompilerArtifactAdapter for use with{' '} + + Sol-compiler + {' '} + and TruffleArtifactAdapter for use with the{' '} + + Truffle framework + . You can also write your own and support any artifact format.

@@ -85,19 +99,19 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`}

Now that we have an artifactAdapter, we can create a{' '} - RevertTraceSubprovider and append it to our provider engine. + TraceSubprovider and append it to our provider engine.

{`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine'; -import { RevertTraceSubprovider } from '@0x/sol-coverage'; +import { TraceSubprovider } from '@0x/sol-coverage'; const defaultFromAddress = "..."; // Some ethereum address with test funds -const revertTraceSubprovider = new RevertTraceSubprovider(artifactAdapter, defaultFromAddress); +const traceSubprovider = new TraceSubprovider(artifactAdapter, defaultFromAddress); const providerEngine = new ProviderEngine(); -providerEngine.addProvider(revertTraceSubprovider); +providerEngine.addProvider(traceSubprovider); providerEngine.addProvider(new RpcSubprovider({rpcUrl: 'http://localhost:8545'})); providerEngine.start();`} -- cgit