Fix copy and links

This commit is contained in:
Fabio Berger
2019-01-11 14:20:56 +01:00
parent ebb10e6604
commit 6fb2721294
7 changed files with 107 additions and 54 deletions

View File

@@ -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<{}> = () => (
<Base context={context}>
<Hero>
@@ -74,15 +77,19 @@ const Compiler: React.StatelessComponent<{}> = () => (
<Content dark={true}>
<ContentBlock main={true} title="Artifacts">
<Lead>
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{' '}
<a href={SOLIDITY_INPUT_FORMAT_DOCS} target="_blank">
Solidity standard JSON input format
</a>{' '}
to specify what to include in the generated artifacts. This way, you have complete flexibility on
what is included.
</Lead>
</ContentBlock>
<ContentBlock title="Production">
<p>
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.
</p>
<Breakout>
<Code isLight={true} language="json" isEtc={true}>
@@ -109,8 +116,9 @@ const Compiler: React.StatelessComponent<{}> = () => (
</ContentBlock>
<ContentBlock title="Development">
<p>
Sometimes you need to use some debuggers or other dev tools and youll 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.
</p>
<Breakout>
<Code isLight={true} language="json" isEtc={true}>

View File

@@ -33,9 +33,9 @@ const Coverage: React.StatelessComponent<{}> = () => (
<Intro>
<IntroLead title="Measure your tests">
<p>
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.
</p>
</IntroLead>
<IntroAside>
@@ -69,10 +69,17 @@ const Coverage: React.StatelessComponent<{}> = () => (
<ContentBlock title="Prerequisites">
<List>
<ListItem>
Use <a href="#">ganache-cli</a> as a backing node.
Use{' '}
<a href="https://www.npmjs.com/package/ganache-cli" target="_blank">
ganache-cli
</a>{' '}
as a backing node.
</ListItem>
<ListItem>
Understand and use <a href="#">web3-provider-engine</a>.
Understand and use{' '}
<a href="https://github.com/MetaMask/provider-engine" target="_blank">
web3-provider-engine
</a>.
</ListItem>
</List>
</ContentBlock>
@@ -82,11 +89,18 @@ const Coverage: React.StatelessComponent<{}> = () => (
</Breakout>
<p>
Sol-coverage is a subprovider that needs to be prepended to your <a href="#">provider engine</a>.
Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-coverage ships
with the <InlineCode>SolCompilerArtifactAdapter</InlineCode> for use with{' '}
<a href="#">Sol-compiler</a> and <InlineCode>TruffleArtifactAdapter</InlineCode> for use with the{' '}
<a href="#">Truffle framework</a>. You can also write your own and support any artifact format.
Sol-coverage is a subprovider that needs to be prepended to your{' '}
<a href="https://github.com/MetaMask/provider-engine" target="_blank">
provider engine
</a>. Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-coverage
ships with the <InlineCode>SolCompilerArtifactAdapter</InlineCode> for use with{' '}
<a href="http://sol-compiler.com" target="_blank">
Sol-compiler
</a>{' '}
and <InlineCode>TruffleArtifactAdapter</InlineCode> for use with the{' '}
<a href="https://truffleframework.com/truffle" target="_blank">
Truffle framework
</a>. You can also write your own and support any artifact format.
</p>
<Tabs>
@@ -118,19 +132,19 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`}
</Tabs>
<p>
Now that we have an <InlineCode>artifactAdapter</InlineCode>, we can create a{' '}
<InlineCode>RevertTraceSubprovider</InlineCode> and append it to our provider engine.
<InlineCode>CoverageSubprovider</InlineCode> and append it to our provider engine.
</p>
<Breakout>
<Code language="javascript">
{`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();`}
</Code>

View File

@@ -66,10 +66,17 @@ const Profiler: React.StatelessComponent<{}> = () => (
<ContentBlock title="Prerequisites">
<List>
<ListItem>
Use <a href="#">ganache-cli</a> as a backing node.
Use{' '}
<a href="https://www.npmjs.com/package/ganache-cli" target="_blank">
ganache-cli
</a>{' '}
as a backing node.
</ListItem>
<ListItem>
Understand and use <a href="#">web3-provider-engine</a>.
Understand and use{' '}
<a href="https://github.com/MetaMask/provider-engine" target="_blank">
web3-provider-engine
</a>.
</ListItem>
</List>
</ContentBlock>
@@ -79,11 +86,18 @@ const Profiler: React.StatelessComponent<{}> = () => (
</Breakout>
<p>
Sol-trace is a subprovider that needs to be prepended to your <a href="#">provider engine</a>.
Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-trace ships
with the <InlineCode>SolCompilerArtifactAdapter</InlineCode> for use with{' '}
<a href="#">Sol-compiler</a> and <InlineCode>TruffleArtifactAdapter</InlineCode> for use with the{' '}
<a href="#">Truffle framework</a>. You can also write your own and support any artifact format.
Sol-trace is a subprovider that needs to be prepended to your{' '}
<a href="https://github.com/MetaMask/provider-engine" target="_blank">
provider engine
</a>. Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-trace
ships with the <InlineCode>SolCompilerArtifactAdapter</InlineCode> for use with{' '}
<a href="http://sol-compiler.com" target="_blank">
Sol-compiler
</a>{' '}
and <InlineCode>TruffleArtifactAdapter</InlineCode> for use with the{' '}
<a href="https://truffleframework.com/truffle" target="_blank">
Truffle framework
</a>. You can also write your own and support any artifact format.
</p>
<Tabs>
@@ -115,19 +129,19 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`}
</Tabs>
<p>
Now that we have an <InlineCode>artifactAdapter</InlineCode>, we can create a{' '}
<InlineCode>RevertTraceSubprovider</InlineCode> and append it to our provider engine.
<InlineCode>ProfilerSubprovider</InlineCode> and append it to our provider engine.
</p>
<Breakout>
<Code language="javascript">
{`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();`}
</Code>

View File

@@ -36,10 +36,17 @@ const Trace: React.StatelessComponent<{}> = () => (
<ContentBlock title="Prerequisites">
<List>
<ListItem>
Use <a href="#">ganache-cli</a> as a backing node.
Use{' '}
<a href="https://www.npmjs.com/package/ganache-cli" target="_blank">
ganache-cli
</a>{' '}
as a backing node.
</ListItem>
<ListItem>
Understand and use <a href="#">web3-provider-engine</a>.
Understand and use{' '}
<a href="https://github.com/MetaMask/provider-engine" target="_blank">
web3-provider-engine
</a>.
</ListItem>
</List>
</ContentBlock>
@@ -49,11 +56,18 @@ const Trace: React.StatelessComponent<{}> = () => (
</Breakout>
<p>
Sol-trace is a subprovider that needs to be prepended to your <a href="#">provider engine</a>.
Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-trace ships
with the <InlineCode>SolCompilerArtifactAdapter</InlineCode> for use with{' '}
<a href="#">Sol-compiler</a> and <InlineCode>TruffleArtifactAdapter</InlineCode> for use with the{' '}
<a href="#">Truffle framework</a>. You can also write your own and support any artifact format.
Sol-trace is a subprovider that needs to be prepended to your{' '}
<a href="https://github.com/MetaMask/provider-engine" target="_blank">
provider engine
</a>. Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-trace
ships with the <InlineCode>SolCompilerArtifactAdapter</InlineCode> for use with{' '}
<a href="http://sol-compiler.com" target="_blank">
Sol-compiler
</a>{' '}
and <InlineCode>TruffleArtifactAdapter</InlineCode> for use with the{' '}
<a href="https://truffleframework.com/truffle" target="_blank">
Truffle framework
</a>. You can also write your own and support any artifact format.
</p>
<Tabs>
@@ -85,19 +99,19 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`}
</Tabs>
<p>
Now that we have an <InlineCode>artifactAdapter</InlineCode>, we can create a{' '}
<InlineCode>RevertTraceSubprovider</InlineCode> and append it to our provider engine.
<InlineCode>TraceSubprovider</InlineCode> and append it to our provider engine.
</p>
<Breakout>
<Code language="javascript">
{`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();`}
</Code>