From 589b535b918ebf132cd55e8dc1ebfbfc96d90fe6 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Wed, 9 Jan 2019 17:30:01 +0100 Subject: Add docLink --- packages/dev-tools-pages/ts/context/cov.tsx | 19 ------------------- packages/dev-tools-pages/ts/context/coverage.tsx | 20 ++++++++++++++++++++ packages/dev-tools-pages/ts/context/index.tsx | 1 + packages/dev-tools-pages/ts/context/profiler.tsx | 1 + packages/dev-tools-pages/ts/context/trace.tsx | 1 + 5 files changed, 23 insertions(+), 19 deletions(-) delete mode 100644 packages/dev-tools-pages/ts/context/cov.tsx create mode 100644 packages/dev-tools-pages/ts/context/coverage.tsx (limited to 'packages') diff --git a/packages/dev-tools-pages/ts/context/cov.tsx b/packages/dev-tools-pages/ts/context/cov.tsx deleted file mode 100644 index 1ade45e9d..000000000 --- a/packages/dev-tools-pages/ts/context/cov.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import Icon from 'ts/icons/logos/cov.svg'; - -import { ContextInterface } from './index'; - -export const context: ContextInterface = { - title: 'sol-cov', - name: 'cov', - subtitle: 'Solidity code coverage', - tagline: 'Measure Solidity code coverage', - icon: Icon, - colors: { - main: '#BB9200', - secondary: '#F1DB8D', - secondary_alt: '#F1D882', - type: '#D7AE1B', - type_alt: '#BD9406', - dark: '#817033', - }, -}; diff --git a/packages/dev-tools-pages/ts/context/coverage.tsx b/packages/dev-tools-pages/ts/context/coverage.tsx new file mode 100644 index 000000000..3e44b6ec2 --- /dev/null +++ b/packages/dev-tools-pages/ts/context/coverage.tsx @@ -0,0 +1,20 @@ +import Icon from 'ts/icons/logos/cov.svg'; + +import { ContextInterface } from './index'; + +export const context: ContextInterface = { + title: 'sol-coverage', + name: 'coverage', + subtitle: 'Solidity code coverage', + docLink: 'https://0x.org/docs/sol-coverage', + tagline: 'Measure Solidity code coverage', + icon: Icon, + colors: { + main: '#BB9200', + secondary: '#F1DB8D', + secondary_alt: '#F1D882', + type: '#D7AE1B', + type_alt: '#BD9406', + dark: '#817033', + }, +}; diff --git a/packages/dev-tools-pages/ts/context/index.tsx b/packages/dev-tools-pages/ts/context/index.tsx index 35c647ad6..97ccf5c16 100644 --- a/packages/dev-tools-pages/ts/context/index.tsx +++ b/packages/dev-tools-pages/ts/context/index.tsx @@ -3,6 +3,7 @@ import { createContext } from 'react'; interface ContextInterface { title?: string; name?: string; + docLink?: string; subtitle?: string; tagline?: string; icon?: React.ReactNode; diff --git a/packages/dev-tools-pages/ts/context/profiler.tsx b/packages/dev-tools-pages/ts/context/profiler.tsx index 5ccfa5b4c..e2ddcb230 100644 --- a/packages/dev-tools-pages/ts/context/profiler.tsx +++ b/packages/dev-tools-pages/ts/context/profiler.tsx @@ -5,6 +5,7 @@ import { ContextInterface } from './index'; export const context: ContextInterface = { title: 'sol-profiler', name: 'profiler', + docLink: 'https://0x.org/docs/sol-profiler', subtitle: 'Gas profiling for Solidity', tagline: "Implement data-guided optimizations by profiling your contract's gas usage", icon: Icon, diff --git a/packages/dev-tools-pages/ts/context/trace.tsx b/packages/dev-tools-pages/ts/context/trace.tsx index 9627cc0a4..3c19661f2 100644 --- a/packages/dev-tools-pages/ts/context/trace.tsx +++ b/packages/dev-tools-pages/ts/context/trace.tsx @@ -6,6 +6,7 @@ export const context: ContextInterface = { title: 'sol-trace', name: 'trace', subtitle: 'Human-readable stack traces', + docLink: 'https://0x.org/docs/sol-trace', tagline: 'Immediately locate Solidity errors and rapidly debug failed transactions', icon: Icon, colors: { -- cgit v1.2.3 From 241be6de30d5c531ec6e9459d14aca54632a7c6a Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Wed, 9 Jan 2019 17:30:34 +0100 Subject: Rename sol-cov to sol-coverage, fix links --- packages/dev-tools-pages/assets/crawl.html | 33 +++-- packages/dev-tools-pages/pages.js | 4 +- packages/dev-tools-pages/ts/components/footer.tsx | 8 +- packages/dev-tools-pages/ts/components/hero.tsx | 4 +- packages/dev-tools-pages/ts/context/compiler.tsx | 1 + packages/dev-tools-pages/ts/pages/cov.tsx | 149 ---------------------- packages/dev-tools-pages/ts/pages/coverage.tsx | 149 ++++++++++++++++++++++ packages/dev-tools-pages/ts/pages/profiler.tsx | 2 +- packages/dev-tools-pages/ts/pages/trace.tsx | 2 +- packages/dev-tools-pages/webpack.config.js | 2 +- 10 files changed, 176 insertions(+), 178 deletions(-) delete mode 100644 packages/dev-tools-pages/ts/pages/cov.tsx create mode 100644 packages/dev-tools-pages/ts/pages/coverage.tsx (limited to 'packages') diff --git a/packages/dev-tools-pages/assets/crawl.html b/packages/dev-tools-pages/assets/crawl.html index 9135c3ede..352300d73 100644 --- a/packages/dev-tools-pages/assets/crawl.html +++ b/packages/dev-tools-pages/assets/crawl.html @@ -1,20 +1,17 @@ - - - - - Document - - - - - - - \ No newline at end of file + + + + + Test + + + + + diff --git a/packages/dev-tools-pages/pages.js b/packages/dev-tools-pages/pages.js index 7609a07e9..ed6266ded 100644 --- a/packages/dev-tools-pages/pages.js +++ b/packages/dev-tools-pages/pages.js @@ -18,9 +18,9 @@ const pages = [ }, { title: 'sol-cov', - filename: 'cov/index.html', + filename: 'coverage/index.html', template: 'assets/index.html', - chunks: ['cov'], + chunks: ['coverage'], favicon: 'assets/favicons/cov.ico', minify: true, meta: { diff --git a/packages/dev-tools-pages/ts/components/footer.tsx b/packages/dev-tools-pages/ts/components/footer.tsx index 04fd9b88e..50ed0439b 100644 --- a/packages/dev-tools-pages/ts/components/footer.tsx +++ b/packages/dev-tools-pages/ts/components/footer.tsx @@ -3,7 +3,7 @@ import * as React from 'react'; import styled from 'styled-components'; import { context as compiler } from 'ts/context/compiler'; -import { context as cov } from 'ts/context/cov'; +import { context as coverage } from 'ts/context/coverage'; import { context as profiler } from 'ts/context/profiler'; import { context as trace } from 'ts/context/trace'; import MainIcon from 'ts/icons/logos/0x.svg'; @@ -12,7 +12,7 @@ import { media } from 'ts/variables'; import { Container } from './container'; import { Alpha, Beta } from './typography'; -const tools = [trace, cov, compiler, profiler]; +const tools = [trace, coverage, compiler, profiler]; const Footer: React.StatelessComponent<{}> = () => ( @@ -20,9 +20,9 @@ const Footer: React.StatelessComponent<{}> = () => ( Other tools by 0x - {_.map(tools, ({ title, subtitle, icon }) => ( + {_.map(tools, ({ title, subtitle, icon, name }) => ( - +
{title} diff --git a/packages/dev-tools-pages/ts/components/hero.tsx b/packages/dev-tools-pages/ts/components/hero.tsx index cdcad6982..688625730 100644 --- a/packages/dev-tools-pages/ts/components/hero.tsx +++ b/packages/dev-tools-pages/ts/components/hero.tsx @@ -9,12 +9,12 @@ import { Beta } from './typography'; const Hero: React.StatelessComponent = ({ children }) => ( - {({ subtitle, tagline }: ContextInterface) => ( + {({ subtitle, tagline, docLink }: ContextInterface) => ( {subtitle} {tagline} - diff --git a/packages/dev-tools-pages/ts/context/compiler.tsx b/packages/dev-tools-pages/ts/context/compiler.tsx index 177e265e5..e4642c826 100644 --- a/packages/dev-tools-pages/ts/context/compiler.tsx +++ b/packages/dev-tools-pages/ts/context/compiler.tsx @@ -5,6 +5,7 @@ import { ContextInterface } from './index'; export const context: ContextInterface = { title: 'sol-compiler', name: 'compiler', + docLink: 'https://0x.org/docs/sol-compiler', subtitle: 'Solidity compilation that just works', tagline: 'Seamlessly compile an entire solidity project and generate customisable artifacts', icon: Icon, diff --git a/packages/dev-tools-pages/ts/pages/cov.tsx b/packages/dev-tools-pages/ts/pages/cov.tsx deleted file mode 100644 index ff1ced27d..000000000 --- a/packages/dev-tools-pages/ts/pages/cov.tsx +++ /dev/null @@ -1,149 +0,0 @@ -import * as React from 'react'; -import { hydrate, render } from 'react-dom'; -import * as Loadable from 'react-loadable'; - -import { context } from 'ts/context/cov'; - -import { Base } from 'ts/components/base'; -import { Breakout } from 'ts/components/breakout'; -import { Code } from 'ts/components/code'; -import { Content } from 'ts/components/content'; -import { ContentBlock } from 'ts/components/content-block'; -import { Hero } from 'ts/components/hero'; -import { InlineCode } from 'ts/components/inline-code'; -import { Intro, IntroAside, IntroLead } from 'ts/components/intro'; -import { List, ListItem } from 'ts/components/list'; -import { TabBlock, Tabs } from 'ts/components/tabs'; - -const Animation = Loadable({ - loader: () => System.import(/* webpackChunkName: 'cov-animation' */ 'ts/components/animations/cov'), - loading: () =>
, - delay: 1000, - render(loadable: { CovAnimation: any }): React.ReactNode { - const Component = loadable.CovAnimation; - return ; - }, -}); - -const Cov: 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. -

- - - - {`+function executeTransaction(uint transactionId) - public -+ notExecuted(transactionId) -+ fullyConfirmed(transactionId) -+ pastTimeLock(transactionId) -{ -+ Transaction storage tx = transactions[transactionId] -+ tx.executed = true -+ if (tx.destination.call.value(tx.value)(tx.data)) -+ Execution(transactionId) - else { -- ExecutionFailure(transactionId) -- tx.executed = false - } -}`} - - - - - - - - - - Use ganache-cli as a backing node. - - - Understand and use web3-provider-engine. - - - - - - npm install @0x/sol-cov --save - - -

- Sol-cov 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-cov 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. -

- - - - - {`import { SolCompilerArtifactAdapter } from '@0x/sol-trace'; - -// Both artifactsDir and contractsDir are optional and will be fetched from compiler.json if not passed in -const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDir);`} - - - - - {`import { TruffleArtifactAdapter } from '@0x/sol-trace'; - -const projectRoot = '.'; -const solcVersion = '0.4.24'; -const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion);`} - - - - - {`import { AbstractArtifactAdapter } from '@0x/sol-trace'; - -class YourCustomArtifactsAdapter extends AbstractArtifactAdapter {...}; -const artifactAdapter = new YourCustomArtifactsAdapter(...);`} - - - -

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

- - - - {`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine'; -import { RevertTraceSubprovider } from '@0x/sol-cov'; - -const defaultFromAddress = "..."; // Some ethereum address with test funds -const revertTraceSubprovider = new RevertTraceSubprovider(artifactAdapter, defaultFromAddress); - -const providerEngine = new ProviderEngine(); -providerEngine.addProvider(revertTraceSubprovider); -providerEngine.addProvider(new RpcSubprovider({rpcUrl: 'http://localhost:8545'})); -providerEngine.start();`} - - - - - -); - -const root = document.getElementById('app'); - -if (root.hasChildNodes()) { - hydrate(, root); -} else { - render(, root); -} diff --git a/packages/dev-tools-pages/ts/pages/coverage.tsx b/packages/dev-tools-pages/ts/pages/coverage.tsx new file mode 100644 index 000000000..cf759c712 --- /dev/null +++ b/packages/dev-tools-pages/ts/pages/coverage.tsx @@ -0,0 +1,149 @@ +import * as React from 'react'; +import { hydrate, render } from 'react-dom'; +import * as Loadable from 'react-loadable'; + +import { context } from 'ts/context/coverage'; + +import { Base } from 'ts/components/base'; +import { Breakout } from 'ts/components/breakout'; +import { Code } from 'ts/components/code'; +import { Content } from 'ts/components/content'; +import { ContentBlock } from 'ts/components/content-block'; +import { Hero } from 'ts/components/hero'; +import { InlineCode } from 'ts/components/inline-code'; +import { Intro, IntroAside, IntroLead } from 'ts/components/intro'; +import { List, ListItem } from 'ts/components/list'; +import { TabBlock, Tabs } from 'ts/components/tabs'; + +const Animation = Loadable({ + loader: () => System.import(/* webpackChunkName: 'cov-animation' */ 'ts/components/animations/cov'), + loading: () =>
, + delay: 1000, + render(loadable: { CovAnimation: any }): React.ReactNode { + const Component = loadable.CovAnimation; + return ; + }, +}); + +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. +

+ + + + {`+function executeTransaction(uint transactionId) + public ++ notExecuted(transactionId) ++ fullyConfirmed(transactionId) ++ pastTimeLock(transactionId) +{ ++ Transaction storage tx = transactions[transactionId] ++ tx.executed = true ++ if (tx.destination.call.value(tx.value)(tx.data)) ++ Execution(transactionId) + else { +- ExecutionFailure(transactionId) +- tx.executed = false + } +}`} + + + + + + + + + + Use ganache-cli as a backing node. + + + Understand and use web3-provider-engine. + + + + + + npm install @0x/sol-coverage --save + + +

+ 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. +

+ + + + + {`import { SolCompilerArtifactAdapter } from '@0x/sol-trace'; + +// Both artifactsDir and contractsDir are optional and will be fetched from compiler.json if not passed in +const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDir);`} + + + + + {`import { TruffleArtifactAdapter } from '@0x/sol-trace'; + +const projectRoot = '.'; +const solcVersion = '0.4.24'; +const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion);`} + + + + + {`import { AbstractArtifactAdapter } from '@0x/sol-trace'; + +class YourCustomArtifactsAdapter extends AbstractArtifactAdapter {...}; +const artifactAdapter = new YourCustomArtifactsAdapter(...);`} + + + +

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

+ + + + {`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine'; +import { RevertTraceSubprovider } from '@0x/sol-coverage'; + +const defaultFromAddress = "..."; // Some ethereum address with test funds +const revertTraceSubprovider = new RevertTraceSubprovider(artifactAdapter, defaultFromAddress); + +const providerEngine = new ProviderEngine(); +providerEngine.addProvider(revertTraceSubprovider); +providerEngine.addProvider(new RpcSubprovider({rpcUrl: 'http://localhost:8545'})); +providerEngine.start();`} + + + + + +); + +const root = document.getElementById('app'); + +if (root.hasChildNodes()) { + hydrate(, root); +} else { + render(, root); +} diff --git a/packages/dev-tools-pages/ts/pages/profiler.tsx b/packages/dev-tools-pages/ts/pages/profiler.tsx index 860e2c25e..16ac9088e 100644 --- a/packages/dev-tools-pages/ts/pages/profiler.tsx +++ b/packages/dev-tools-pages/ts/pages/profiler.tsx @@ -121,7 +121,7 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`} {`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine'; -import { RevertTraceSubprovider } from '@0x/sol-cov'; +import { RevertTraceSubprovider } from '@0x/sol-coverage'; const defaultFromAddress = "..."; // Some ethereum address with test funds const revertTraceSubprovider = new RevertTraceSubprovider(artifactAdapter, defaultFromAddress); diff --git a/packages/dev-tools-pages/ts/pages/trace.tsx b/packages/dev-tools-pages/ts/pages/trace.tsx index a25d2eff8..cc34e0fbe 100644 --- a/packages/dev-tools-pages/ts/pages/trace.tsx +++ b/packages/dev-tools-pages/ts/pages/trace.tsx @@ -91,7 +91,7 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`} {`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine'; -import { RevertTraceSubprovider } from '@0x/sol-cov'; +import { RevertTraceSubprovider } from '@0x/sol-coverage'; const defaultFromAddress = "..."; // Some ethereum address with test funds const revertTraceSubprovider = new RevertTraceSubprovider(artifactAdapter, defaultFromAddress); diff --git a/packages/dev-tools-pages/webpack.config.js b/packages/dev-tools-pages/webpack.config.js index 640297770..2213d3c21 100644 --- a/packages/dev-tools-pages/webpack.config.js +++ b/packages/dev-tools-pages/webpack.config.js @@ -12,7 +12,7 @@ const pages = require('./pages'); const config = { entry: { compiler: './ts/pages/compiler.tsx', - cov: './ts/pages/cov.tsx', + coverage: './ts/pages/coverage.tsx', profiler: './ts/pages/profiler.tsx', trace: './ts/pages/trace.tsx', }, -- cgit v1.2.3 From dc20429bca51876e94ee747e3cb925ae0ac6a4ac Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 10 Jan 2019 20:14:51 +0100 Subject: Add deployment commands for the Dev tools pages --- packages/dev-tools-pages/package.json | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/package.json b/packages/dev-tools-pages/package.json index db927849e..bb8da7fe9 100644 --- a/packages/dev-tools-pages/package.json +++ b/packages/dev-tools-pages/package.json @@ -12,7 +12,17 @@ "build:dev": "../../node_modules/.bin/webpack --mode development", "clean": "shx rm -f public/bundle*", "lint": "tslint --format stylish --project . 'ts/**/*.ts' 'ts/**/*.tsx'", - "dev": "webpack-dev-server --mode development --content-base public" + "dev": "webpack-dev-server --mode development --content-base public", + "deploy:all": "npm run build; npm run deploy:compiler; npm run deploy:compiler:index; npm run deploy:coverage; npm run deploy:coverage:index; npm run deploy:profiler; npm run deploy:profiler:index; npm run deploy:trace; npm run deploy:trace:index;", + "deploy:compiler": "DIR_NAME=./public/. BUCKET=s3://sol-compiler.com yarn s3:sync --exclude 'bundle-cov*' --exclude 'bundle-trace*' --exclude 'bundle-profiler*'", + "deploy:coverage": "DIR_NAME=./public/. BUCKET=s3://sol-coverage.com yarn s3:sync --exclude 'bundle-compiler*' --exclude 'bundle-trace*' --exclude 'bundle-profiler*'", + "deploy:profiler": "DIR_NAME=./public/. BUCKET=s3://sol-profiler.com yarn s3:sync --exclude 'bundle-cov*' --exclude 'bundle-trace*' --exclude 'bundle-compiler*'", + "deploy:trace": "DIR_NAME=./public/. BUCKET=s3://sol-trace.com yarn s3:sync --exclude 'bundle-cov*' --exclude 'bundle-compiler*' --exclude 'bundle-profiler*'", + "deploy:compiler:index": "DIR_NAME=./public/compiler/. BUCKET=s3://sol-compiler.com yarn s3:sync", + "deploy:coverage:index": "DIR_NAME=./public/coverage/. BUCKET=s3://sol-coverage.com yarn s3:sync", + "deploy:profiler:index": "DIR_NAME=./public/profiler/. BUCKET=s3://sol-profiler.com yarn s3:sync", + "deploy:trace:index": "DIR_NAME=./public/trace/. BUCKET=s3://sol-trace.com yarn s3:sync", + "s3:sync": "aws s3 sync $DIR_NAME $BUCKET --profile 0xproject --region us-east-1 --grants read=uri=http://acs.amazonaws.com/groups/global/AllUsers --exclude *.map.js --exclude 'profiler/*' --exclude 'trace/*' --exclude 'coverage/*' --exclude 'compiler/*'" }, "license": "Apache-2.0", "dependencies": { -- cgit v1.2.3 From a516b00a0397a567fd233bd955206d46321cc178 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 11 Jan 2019 00:45:26 +0100 Subject: Fix footer links --- packages/dev-tools-pages/ts/components/footer.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/ts/components/footer.tsx b/packages/dev-tools-pages/ts/components/footer.tsx index 50ed0439b..d568a86fc 100644 --- a/packages/dev-tools-pages/ts/components/footer.tsx +++ b/packages/dev-tools-pages/ts/components/footer.tsx @@ -22,7 +22,7 @@ const Footer: React.StatelessComponent<{}> = () => ( {_.map(tools, ({ title, subtitle, icon, name }) => ( - +
{title} -- cgit v1.2.3 From db878f4a7bdddef81a70b5fb9b533c08bde8c453 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 11 Jan 2019 14:15:15 +0100 Subject: Fix title and og tags for sol-coverage --- packages/dev-tools-pages/pages.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/pages.js b/packages/dev-tools-pages/pages.js index ed6266ded..0f19f4744 100644 --- a/packages/dev-tools-pages/pages.js +++ b/packages/dev-tools-pages/pages.js @@ -17,7 +17,7 @@ const pages = [ }, }, { - title: 'sol-cov', + title: 'sol-coverage', filename: 'coverage/index.html', template: 'assets/index.html', chunks: ['coverage'], @@ -25,7 +25,7 @@ const pages = [ minify: true, meta: { description: 'Solidity code coverage', - 'og-title': { property: 'og:title', content: 'sol-cov' }, + 'og-title': { property: 'og:title', content: 'sol-coverage' }, 'og-description': { property: 'og:description', content: 'Solidity code coverage' }, 'og-type': { property: 'og:type', content: 'website' }, 'og-image': { property: 'og:image', content: '/images/og-cov' }, -- cgit v1.2.3 From ebb10e66045613b7265e4d23e40b63ecf49af4fe Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 11 Jan 2019 14:15:24 +0100 Subject: Remove unused import --- packages/dev-tools-pages/webpack.config.js | 1 - 1 file changed, 1 deletion(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/webpack.config.js b/packages/dev-tools-pages/webpack.config.js index 2213d3c21..ef2f98cf2 100644 --- a/packages/dev-tools-pages/webpack.config.js +++ b/packages/dev-tools-pages/webpack.config.js @@ -3,7 +3,6 @@ const webpack = require('webpack'); const TerserPlugin = require('terser-webpack-plugin'); const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; const HtmlWebpackPlugin = require('html-webpack-plugin'); -const childProcess = require('child_process'); const CopyWebpackPlugin = require('copy-webpack-plugin'); const CleanWebpackPlugin = require('clean-webpack-plugin'); -- cgit v1.2.3 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 --- .../dev-tools-pages/ts/components/compiler.tsx | 12 ++++--- packages/dev-tools-pages/ts/components/hero.tsx | 2 +- packages/dev-tools-pages/ts/components/trace.tsx | 13 ++++--- 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 +++++++++++++------ 7 files changed, 107 insertions(+), 54 deletions(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/ts/components/compiler.tsx b/packages/dev-tools-pages/ts/components/compiler.tsx index 694a535dd..c00e3a2b9 100644 --- a/packages/dev-tools-pages/ts/components/compiler.tsx +++ b/packages/dev-tools-pages/ts/components/compiler.tsx @@ -45,7 +45,7 @@ const Dd = styled.dd` const cards = [ { - title: 'A Project-centric', + title: 'Project-centric', body: ( Compiles an entire project instead of only individual .sol files. @@ -54,7 +54,7 @@ const cards = [ }, { title: 'Incremental builds', - body: 'Recompiles your smart contracts after they have changed', + body: 'Only recompiles smart contracts that have been modified.', }, { title: 'Customizable artifacts', @@ -63,12 +63,16 @@ const cards = [ }, { title: 'Seamless', - body: 'Fetches and caches the required compiler binaries.', + body: 'Fetches and caches the required compiler binaries for the Solidity versions you use.', }, { title: 'Versioning', body: - 'Compiles each contract with the version specified at the top of its file (sol-compiler even supports version ranges!).', + 'Compiles each contract with the Solidity version specified at the top of its file (it even supports version ranges!).', + }, + { + title: 'Watch mode', + body: 'Have your contracts instantly recompile on file save.', }, ]; diff --git a/packages/dev-tools-pages/ts/components/hero.tsx b/packages/dev-tools-pages/ts/components/hero.tsx index 688625730..a024a49dc 100644 --- a/packages/dev-tools-pages/ts/components/hero.tsx +++ b/packages/dev-tools-pages/ts/components/hero.tsx @@ -14,7 +14,7 @@ const Hero: React.StatelessComponent = ({ children }) => ( {subtitle} {tagline} - diff --git a/packages/dev-tools-pages/ts/components/trace.tsx b/packages/dev-tools-pages/ts/components/trace.tsx index 108154648..96e75013d 100644 --- a/packages/dev-tools-pages/ts/components/trace.tsx +++ b/packages/dev-tools-pages/ts/components/trace.tsx @@ -25,7 +25,7 @@ const Trace: React.StatelessComponent<{}> = () => ( troublemaking line of code. The only hint you'll get is a generic error. - Error: VM Exception while processing transaction: rever + Error: VM Exception while processing transaction: revert @@ -44,8 +44,8 @@ const Trace: React.StatelessComponent<{}> = () => ( Time-consuming

- Working with a large code-base that contains hundreds of smart contracts, - finding the failing line of code quickly becomes a daunting task. + Working within a large code-base that contains many smart contracts, finding the + failing line of code quickly becomes a daunting task.

@@ -78,8 +78,8 @@ const Trace: React.StatelessComponent<{}> = () => ( Exact location

- It shows you the exact location of the specific code linen and where it was - called from. + It shows you the exact location of the offending line and where it was called + from.

@@ -90,8 +90,7 @@ const Trace: React.StatelessComponent<{}> = () => ( Time-saving

Turning "Your code failed somewhere, good luck debugging it" into "Your code - failed on line X of contract Y", it drastically improves the developer - experience. + failed on line X of contract Y", drastically improves the developer experience.

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 v1.2.3 From 6871f36dadf720e600a75d4a07f0464e69e10c86 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Wed, 16 Jan 2019 18:44:52 +0100 Subject: Update 0x url --- packages/dev-tools-pages/ts/components/header.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/ts/components/header.tsx b/packages/dev-tools-pages/ts/components/header.tsx index 2787692c1..49019910c 100644 --- a/packages/dev-tools-pages/ts/components/header.tsx +++ b/packages/dev-tools-pages/ts/components/header.tsx @@ -17,7 +17,7 @@ const Header: React.StatelessComponent<{}> = () => ( {title} - + Built by 0x -- cgit v1.2.3 From b2ea4f6aafd35951fd1f002f8c8aafc79bb02b0f Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 17 Jan 2019 12:53:09 +0100 Subject: Update requirement sections --- packages/dev-tools-pages/ts/pages/coverage.tsx | 22 ++++++++++++++++------ packages/dev-tools-pages/ts/pages/profiler.tsx | 24 +++++++++++++++++------- packages/dev-tools-pages/ts/pages/trace.tsx | 24 +++++++++++++++++------- 3 files changed, 50 insertions(+), 20 deletions(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/ts/pages/coverage.tsx b/packages/dev-tools-pages/ts/pages/coverage.tsx index de03d3a9c..0e0630a0c 100644 --- a/packages/dev-tools-pages/ts/pages/coverage.tsx +++ b/packages/dev-tools-pages/ts/pages/coverage.tsx @@ -70,16 +70,24 @@ const Coverage: React.StatelessComponent<{}> = () => ( Use{' '} - - ganache-cli + + Geth {' '} - as a backing node. + as a backing node. We recommend using our{' '} + + Devnet Docker container + {' '} + which sets up a Geth node for testing purposes.{' '} + + Ganache support is a work in progress. + Understand and use{' '} web3-provider-engine - . + + . @@ -92,7 +100,8 @@ 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 + + . Depending on your project setup, you will need to use a specific ArtifactAdapter. Sol-coverage ships with the SolCompilerArtifactAdapter for use with{' '} Sol-compiler @@ -100,7 +109,8 @@ const Coverage: React.StatelessComponent<{}> = () => ( and TruffleArtifactAdapter for use with the{' '} Truffle framework - . You can also write your own and support any artifact format. + + . You can also write your own and support any artifact format.

diff --git a/packages/dev-tools-pages/ts/pages/profiler.tsx b/packages/dev-tools-pages/ts/pages/profiler.tsx index feca368ba..96fad3495 100644 --- a/packages/dev-tools-pages/ts/pages/profiler.tsx +++ b/packages/dev-tools-pages/ts/pages/profiler.tsx @@ -67,16 +67,24 @@ const Profiler: React.StatelessComponent<{}> = () => ( Use{' '} - - ganache-cli + + Geth {' '} - as a backing node. + as a backing node. We recommend using our{' '} + + Devnet Docker container + {' '} + which sets up a Geth node for testing purposes.{' '} + + Ganache support is a work in progress. + Understand and use{' '} web3-provider-engine - . + + . @@ -89,15 +97,17 @@ 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{' '} + + . 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. + + . You can also write your own and support any artifact format.

diff --git a/packages/dev-tools-pages/ts/pages/trace.tsx b/packages/dev-tools-pages/ts/pages/trace.tsx index 1fa159461..8b2ec8373 100644 --- a/packages/dev-tools-pages/ts/pages/trace.tsx +++ b/packages/dev-tools-pages/ts/pages/trace.tsx @@ -37,16 +37,24 @@ const Trace: React.StatelessComponent<{}> = () => ( Use{' '} - - ganache-cli + + Geth {' '} - as a backing node. + as a backing node. We recommend using our{' '} + + Devnet Docker container + {' '} + which sets up a Geth node for testing purposes.{' '} + + Ganache support is a work in progress. + Understand and use{' '} web3-provider-engine - . + + . @@ -59,15 +67,17 @@ 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{' '} + + . 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. + + . You can also write your own and support any artifact format.

-- cgit v1.2.3 From 56b8fd2074bc38dee26661d719fad3e88580ef54 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 17 Jan 2019 12:55:14 +0100 Subject: Add fonts --- packages/dev-tools-pages/.gitignore | 4 +--- packages/dev-tools-pages/assets/fonts/.gitkeep | 0 .../assets/fonts/MaisonNeue-Bold-subset.woff2 | Bin 0 -> 11248 bytes .../assets/fonts/MaisonNeue-Book-subset.woff2 | Bin 0 -> 11232 bytes 4 files changed, 1 insertion(+), 3 deletions(-) delete mode 100644 packages/dev-tools-pages/assets/fonts/.gitkeep create mode 100644 packages/dev-tools-pages/assets/fonts/MaisonNeue-Bold-subset.woff2 create mode 100644 packages/dev-tools-pages/assets/fonts/MaisonNeue-Book-subset.woff2 (limited to 'packages') diff --git a/packages/dev-tools-pages/.gitignore b/packages/dev-tools-pages/.gitignore index 557b82311..d70ebaa1d 100644 --- a/packages/dev-tools-pages/.gitignore +++ b/packages/dev-tools-pages/.gitignore @@ -1,3 +1 @@ -public -assets/fonts/*.woff -assets/fonts/*.woff2 \ No newline at end of file +public \ No newline at end of file diff --git a/packages/dev-tools-pages/assets/fonts/.gitkeep b/packages/dev-tools-pages/assets/fonts/.gitkeep deleted file mode 100644 index e69de29bb..000000000 diff --git a/packages/dev-tools-pages/assets/fonts/MaisonNeue-Bold-subset.woff2 b/packages/dev-tools-pages/assets/fonts/MaisonNeue-Bold-subset.woff2 new file mode 100644 index 000000000..54424f6fc Binary files /dev/null and b/packages/dev-tools-pages/assets/fonts/MaisonNeue-Bold-subset.woff2 differ diff --git a/packages/dev-tools-pages/assets/fonts/MaisonNeue-Book-subset.woff2 b/packages/dev-tools-pages/assets/fonts/MaisonNeue-Book-subset.woff2 new file mode 100644 index 000000000..8c2dea7ef Binary files /dev/null and b/packages/dev-tools-pages/assets/fonts/MaisonNeue-Book-subset.woff2 differ -- cgit v1.2.3 From a873872cc77e53fc849e9b81bb9e8361e776c851 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 17 Jan 2019 13:03:18 +0100 Subject: Open 0x.org on different tab --- packages/dev-tools-pages/ts/components/header.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/ts/components/header.tsx b/packages/dev-tools-pages/ts/components/header.tsx index 49019910c..4d3a8685c 100644 --- a/packages/dev-tools-pages/ts/components/header.tsx +++ b/packages/dev-tools-pages/ts/components/header.tsx @@ -17,7 +17,7 @@ const Header: React.StatelessComponent<{}> = () => ( {title} - + Built by 0x -- cgit v1.2.3 From 737941e8c79376814b25b36737384c176a26fbff Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 17 Jan 2019 13:29:47 +0100 Subject: Add call-to-action docs button at end of instructions again --- .../ts/components/call_to_action.tsx | 61 ++++++++++++++++++++++ packages/dev-tools-pages/ts/pages/compiler.tsx | 4 ++ packages/dev-tools-pages/ts/pages/coverage.tsx | 2 + packages/dev-tools-pages/ts/pages/profiler.tsx | 2 + packages/dev-tools-pages/ts/pages/trace.tsx | 3 ++ 5 files changed, 72 insertions(+) create mode 100644 packages/dev-tools-pages/ts/components/call_to_action.tsx (limited to 'packages') diff --git a/packages/dev-tools-pages/ts/components/call_to_action.tsx b/packages/dev-tools-pages/ts/components/call_to_action.tsx new file mode 100644 index 000000000..abb92b9d3 --- /dev/null +++ b/packages/dev-tools-pages/ts/components/call_to_action.tsx @@ -0,0 +1,61 @@ +import * as React from 'react'; +import styled from 'styled-components'; + +import { ContextInterface, ThemeContext } from 'ts/context'; +import { media } from 'ts/variables'; + +import { Button } from './button'; +import { Beta } from './typography'; + +const CallToAction: React.StatelessComponent = ({ children }) => ( + + {({ subtitle, tagline, docLink }: ContextInterface) => ( + + + + + {navigator.userAgent !== 'ReactSnap' ? children : null} + + )} + +); + +const StyledCallToAction = styled.section` + text-align: center; + padding-top: 0; + padding-bottom: 1rem; + padding-left: 2.5rem; + padding-right: 2.5rem; + min-height: min-content; + max-height: 37.5rem; + height: 20vh; + position: relative; +`; + +const CallToActionContainer = styled.div` + margin: 0 auto; + max-width: 590px; +`; + +const Subtitle = styled.h2` + font-size: 3.75rem; + line-height: 1.16; + margin-bottom: 1.5rem; + + ${media.small` + font-size: 2.25rem; + line-height: 1.1; + margin-bottom: 1.375rem; + `}; +`; + +const Tagline = styled(Beta)` + margin-bottom: 2rem; + ${media.small` + margin-bottom: 1.25rem; + `}; +`; + +export { CallToAction }; diff --git a/packages/dev-tools-pages/ts/pages/compiler.tsx b/packages/dev-tools-pages/ts/pages/compiler.tsx index 0468fd84f..27bbec831 100644 --- a/packages/dev-tools-pages/ts/pages/compiler.tsx +++ b/packages/dev-tools-pages/ts/pages/compiler.tsx @@ -6,6 +6,7 @@ import { context } from 'ts/context/compiler'; import { Base } from 'ts/components/base'; import { Breakout } from 'ts/components/breakout'; +import { CallToAction } from 'ts/components/call_to_action'; import { Code } from 'ts/components/code'; import { Compiler as CompilerComponent } from 'ts/components/compiler'; import { Content } from 'ts/components/content'; @@ -166,6 +167,9 @@ const Compiler: React.StatelessComponent<{}> = () => ( +
+ +
); diff --git a/packages/dev-tools-pages/ts/pages/coverage.tsx b/packages/dev-tools-pages/ts/pages/coverage.tsx index 0e0630a0c..de61a4042 100644 --- a/packages/dev-tools-pages/ts/pages/coverage.tsx +++ b/packages/dev-tools-pages/ts/pages/coverage.tsx @@ -6,6 +6,7 @@ import { context } from 'ts/context/coverage'; import { Base } from 'ts/components/base'; import { Breakout } from 'ts/components/breakout'; +import { CallToAction } from 'ts/components/call_to_action'; import { Code } from 'ts/components/code'; import { Content } from 'ts/components/content'; import { ContentBlock } from 'ts/components/content-block'; @@ -161,6 +162,7 @@ providerEngine.start();`} + ); diff --git a/packages/dev-tools-pages/ts/pages/profiler.tsx b/packages/dev-tools-pages/ts/pages/profiler.tsx index 96fad3495..4ce69ea7b 100644 --- a/packages/dev-tools-pages/ts/pages/profiler.tsx +++ b/packages/dev-tools-pages/ts/pages/profiler.tsx @@ -6,6 +6,7 @@ import { context } from 'ts/context/profiler'; import { Base } from 'ts/components/base'; import { Breakout } from 'ts/components/breakout'; +import { CallToAction } from 'ts/components/call_to_action'; import { Code } from 'ts/components/code'; import { Content } from 'ts/components/content'; import { ContentBlock } from 'ts/components/content-block'; @@ -158,6 +159,7 @@ providerEngine.start();`} + ); diff --git a/packages/dev-tools-pages/ts/pages/trace.tsx b/packages/dev-tools-pages/ts/pages/trace.tsx index 8b2ec8373..465d995b5 100644 --- a/packages/dev-tools-pages/ts/pages/trace.tsx +++ b/packages/dev-tools-pages/ts/pages/trace.tsx @@ -6,6 +6,7 @@ import { context } from 'ts/context/trace'; import { Base } from 'ts/components/base'; import { Breakout } from 'ts/components/breakout'; +import { CallToAction } from 'ts/components/call_to_action'; import { Code } from 'ts/components/code'; import { Content } from 'ts/components/content'; import { ContentBlock } from 'ts/components/content-block'; @@ -126,8 +127,10 @@ providerEngine.addProvider(new RpcSubprovider({rpcUrl: 'http://localhost:8545'}) providerEngine.start();`} +

Stack traces will now be printed whenever your contracts revert!

+ ); -- cgit v1.2.3 From 3b79754b7a42501698f4c4d3e8e4100f520cae16 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 17 Jan 2019 15:37:43 +0100 Subject: Remove incorrect section of docs --- packages/website/md/docs/sol_trace/usage.md | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) (limited to 'packages') diff --git a/packages/website/md/docs/sol_trace/usage.md b/packages/website/md/docs/sol_trace/usage.md index f3aa6fc35..516585683 100644 --- a/packages/website/md/docs/sol_trace/usage.md +++ b/packages/website/md/docs/sol_trace/usage.md @@ -53,10 +53,4 @@ const traceSubprovider = new TraceSubprovider(artifactsAdapter, defaultFromAddre provider.addProvider(traceSubprovider); ``` -After your test suite is complete (e.g in the Mocha global `after` hook), you'll need to call: - -```typescript -await traceSubprovider.writeTraceAsync(); -``` - -This will create a `trace.json` file in a `trace` directory. This file has an [Istanbul format](https://github.com/gotwarlost/istanbul/blob/master/trace.json.md) - so you can use it with any of the existing Istanbul reporters. +Now when you run your tests, it should print out stack traces when encountering an error. -- cgit v1.2.3 From d92dc47df83a38c3caba845ae053b39ccffd36b1 Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Thu, 17 Jan 2019 15:44:34 +0100 Subject: Last touches --- packages/dev-tools-pages/ts/pages/coverage.tsx | 2 +- packages/dev-tools-pages/ts/pages/profiler.tsx | 4 +-- packages/dev-tools-pages/ts/pages/trace.tsx | 10 +++--- .../website/md/docs/sol_coverage/installation.md | 2 +- .../website/md/docs/sol_coverage/introduction.md | 2 +- packages/website/md/docs/sol_coverage/usage.md | 26 +++++++++------- .../website/md/docs/sol_profiler/installation.md | 2 +- packages/website/md/docs/sol_profiler/usage.md | 30 ++++++++++-------- packages/website/md/docs/sol_trace/installation.md | 6 ++-- packages/website/md/docs/sol_trace/introduction.md | 2 +- packages/website/md/docs/sol_trace/usage.md | 36 ++++++++++++---------- 11 files changed, 67 insertions(+), 55 deletions(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/ts/pages/coverage.tsx b/packages/dev-tools-pages/ts/pages/coverage.tsx index de61a4042..dc1f66462 100644 --- a/packages/dev-tools-pages/ts/pages/coverage.tsx +++ b/packages/dev-tools-pages/ts/pages/coverage.tsx @@ -128,7 +128,7 @@ const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDi {`import { TruffleArtifactAdapter } from '@0x/sol-trace'; const projectRoot = '.'; -const solcVersion = '0.4.24'; +const solcVersion = '0.5.0'; const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion);`} diff --git a/packages/dev-tools-pages/ts/pages/profiler.tsx b/packages/dev-tools-pages/ts/pages/profiler.tsx index 4ce69ea7b..4af0dd851 100644 --- a/packages/dev-tools-pages/ts/pages/profiler.tsx +++ b/packages/dev-tools-pages/ts/pages/profiler.tsx @@ -125,7 +125,7 @@ const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDi {`import { TruffleArtifactAdapter } from '@0x/sol-trace'; const projectRoot = '.'; -const solcVersion = '0.4.24'; +const solcVersion = '0.5.0'; const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion);`} @@ -146,7 +146,7 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`} {`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine'; -import { ProfilerSubprovider } from '@0x/sol-coverage'; +import { ProfilerSubprovider } from '@0x/sol-profiler'; const defaultFromAddress = "..."; // Some ethereum address with test funds const profilerSubprovider = new ProfilerSubprovider(artifactAdapter, defaultFromAddress); diff --git a/packages/dev-tools-pages/ts/pages/trace.tsx b/packages/dev-tools-pages/ts/pages/trace.tsx index 465d995b5..abfac45dd 100644 --- a/packages/dev-tools-pages/ts/pages/trace.tsx +++ b/packages/dev-tools-pages/ts/pages/trace.tsx @@ -95,7 +95,7 @@ const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDi {`import { TruffleArtifactAdapter } from '@0x/sol-trace'; const projectRoot = '.'; -const solcVersion = '0.4.24'; +const solcVersion = '0.5.0'; const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion);`} @@ -110,19 +110,19 @@ const artifactAdapter = new YourCustomArtifactsAdapter(...);`}

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

{`import { ProviderEngine, RpcSubprovider } from 'web3-provider-engine'; -import { TraceSubprovider } from '@0x/sol-coverage'; +import { RevertTraceSubprovider } from '@0x/sol-trace'; const defaultFromAddress = "..."; // Some ethereum address with test funds -const traceSubprovider = new TraceSubprovider(artifactAdapter, defaultFromAddress); +const revertTraceSubprovider = new RevertTraceSubprovider(artifactAdapter, defaultFromAddress); const providerEngine = new ProviderEngine(); -providerEngine.addProvider(traceSubprovider); +providerEngine.addProvider(revertTraceSubprovider); providerEngine.addProvider(new RpcSubprovider({rpcUrl: 'http://localhost:8545'})); providerEngine.start();`} diff --git a/packages/website/md/docs/sol_coverage/installation.md b/packages/website/md/docs/sol_coverage/installation.md index c7aaf07e9..7c9840ab8 100644 --- a/packages/website/md/docs/sol_coverage/installation.md +++ b/packages/website/md/docs/sol_coverage/installation.md @@ -1,7 +1,7 @@ **Install** ```bash -yarn add @0x/sol-coverage +yarn add -D @0x/sol-coverage ``` **Import** diff --git a/packages/website/md/docs/sol_coverage/introduction.md b/packages/website/md/docs/sol_coverage/introduction.md index 3214e93a9..f21f8ecbe 100644 --- a/packages/website/md/docs/sol_coverage/introduction.md +++ b/packages/website/md/docs/sol_coverage/introduction.md @@ -1 +1 @@ -Welcome to the [sol-coverage](https://github.com/0xProject/0x-monorepo/tree/development/packages/sol-coverage) documentation! Sol-coverage is a Solidity coverage tool for your smart contract tests. +Welcome to the [sol-coverage](https://github.com/0xProject/0x-monorepo/tree/development/packages/sol-coverage) documentation! Sol-coverage is a Solidity coverage tool. diff --git a/packages/website/md/docs/sol_coverage/usage.md b/packages/website/md/docs/sol_coverage/usage.md index dd3cdf597..9f9913d28 100644 --- a/packages/website/md/docs/sol_coverage/usage.md +++ b/packages/website/md/docs/sol_coverage/usage.md @@ -1,4 +1,4 @@ -Sol-coverage uses transaction traces in order to figure out which lines of Solidity source code have been covered by your tests. In order for it to gather these traces, you must add the `CoverageSubprovider` to the [ProviderEngine](https://github.com/MetaMask/provider-engine) instance you use when running your Solidity tests. If you're unfamiliar with ProviderEngine, please read the [Web3 Provider explained](https://0x.org/wiki#Web3-Provider-Explained) wiki article. +Sol-coverage uses transaction traces in order to figure out which lines of Solidity source code have been covered by your tests. In order for it to gather these traces, you must add the `CoverageSubprovider` to the [ProviderEngine](https://github.com/MetaMask/provider-engine) instance you use when running your Solidity tests. If you're unfamiliar with `ProviderEngine`, please read the [Web3 Provider explained](https://0x.org/wiki#Web3-Provider-Explained) wiki article. The CoverageSubprovider eavesdrops on the `eth_sendTransaction` and `eth_call` RPC calls and collects traces after each call using `debug_traceTransaction`. `eth_call`'s' don't generate traces - so we take a snapshot, re-submit it as a transaction, get the trace and then revert the snapshot. @@ -12,9 +12,8 @@ If you are generating your artifacts with [@0x/sol-compiler](https://0x.org/docs ```typescript import { SolCompilerArtifactsAdapter } from '@0x/sol-coverage'; -const artifactsPath = 'src/artifacts'; -const contractsPath = 'src/contracts'; -const artifactsAdapter = new SolCompilerArtifactsAdapter(artifactsPath, contractsPath); +// Both artifactsDir and contractsDir are optional and will be fetched from compiler.json if not passed in +const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDir); ``` ### Truffle @@ -23,8 +22,9 @@ If your project is using [Truffle](https://truffleframework.com/), we've written ```typescript import { TruffleArtifactAdapter } from '@0x/sol-coverage'; -const contractsPath = 'src/contracts'; -const artifactAdapter = new TruffleArtifactAdapter(contractsDir); +const projectRoot = '.'; +const solcVersion = '0.5.0'; +const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion); ``` Because truffle artifacts don't have all the data we need - we actually will recompile your contracts under the hood. That's why you don't need to pass an `artifactsPath`. @@ -32,7 +32,13 @@ Because truffle artifacts don't have all the data we need - we actually will rec ### Other framework/toolset You'll need to write your own artifacts adapter. It should extend `AbstractArtifactsAdapter`. -Look at the code of the two adapters above for examples. + +```typescript +import { AbstractArtifactAdapter } from '@0x/sol-trace'; + +class YourCustomArtifactsAdapter extends AbstractArtifactAdapter {...}; +const artifactAdapter = new YourCustomArtifactsAdapter(...); +``` ### Usage @@ -41,16 +47,14 @@ import { CoverageSubprovider } from '@0x/sol-coverage'; import ProviderEngine = require('web3-provider-engine'); const provider = new ProviderEngine(); - -const artifactsPath = 'src/artifacts'; -const contractsPath = 'src/contracts'; -const networkId = 50; // Some calls might not have `from` address specified. Nevertheless - transactions need to be submitted from an address with at least some funds. defaultFromAddress is the address that will be used to submit those calls as transactions from. const defaultFromAddress = '0x5409ed021d9299bf6814279a6a1411a7e866a631'; const isVerbose = true; const coverageSubprovider = new CoverageSubprovider(artifactsAdapter, defaultFromAddress, isVerbose); provider.addProvider(coverageSubprovider); +// Add all your other providers +provider.start(); ``` After your test suite is complete (e.g in the Mocha global `after` hook), you'll need to call: diff --git a/packages/website/md/docs/sol_profiler/installation.md b/packages/website/md/docs/sol_profiler/installation.md index be9a365f5..e29ac5ae7 100644 --- a/packages/website/md/docs/sol_profiler/installation.md +++ b/packages/website/md/docs/sol_profiler/installation.md @@ -1,7 +1,7 @@ **Install** ```bash -yarn add @0x/sol-profiler +yarn add -D @0x/sol-profiler ``` **Import** diff --git a/packages/website/md/docs/sol_profiler/usage.md b/packages/website/md/docs/sol_profiler/usage.md index 35ea140da..f9bab7ebf 100644 --- a/packages/website/md/docs/sol_profiler/usage.md +++ b/packages/website/md/docs/sol_profiler/usage.md @@ -1,4 +1,4 @@ -Sol-profiler uses transaction traces in order to figure out which lines of Solidity source code have been covered by your tests. In order for it to gather these traces, you must add the `ProfilerSubprovider` to the [ProviderEngine](https://github.com/MetaMask/provider-engine) instance you use when running your Solidity tests. If you're unfamiliar with ProviderEngine, please read the [Web3 Provider explained](https://0x.org/wiki#Web3-Provider-Explained) wiki article. +Sol-profiler uses transaction traces in order to figure out which lines of Solidity source code have been covered by your tests. In order for it to gather these traces, you must add the `ProfilerSubprovider` to the [ProviderEngine](https://github.com/MetaMask/provider-engine) instance you use when running your Solidity tests. If you're unfamiliar with `ProviderEngine`, please read the [Web3 Provider explained](https://0x.org/wiki#Web3-Provider-Explained) wiki article. The ProfilerSubprovider eavesdrops on the `eth_sendTransaction` and `eth_call` RPC calls and collects traces after each call using `debug_traceTransaction`. `eth_call`'s' don't generate traces - so we take a snapshot, re-submit it as a transaction, get the trace and then revert the snapshot. @@ -12,9 +12,8 @@ If you are generating your artifacts with [@0x/sol-compiler](https://0x.org/docs ```typescript import { SolCompilerArtifactsAdapter } from '@0x/sol-profiler'; -const artifactsPath = 'src/artifacts'; -const contractsPath = 'src/contracts'; -const artifactsAdapter = new SolCompilerArtifactsAdapter(artifactsPath, contractsPath); +// Both artifactsDir and contractsDir are optional and will be fetched from compiler.json if not passed in +const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDir); ``` ### Truffle @@ -23,8 +22,9 @@ If your project is using [Truffle](https://truffleframework.com/), we've written ```typescript import { TruffleArtifactAdapter } from '@0x/sol-profiler'; -const contractsPath = 'src/contracts'; -const artifactAdapter = new TruffleArtifactAdapter(contractsDir); +const projectRoot = '.'; +const solcVersion = '0.5.0'; +const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion); ``` Because truffle artifacts don't have all the data we need - we actually will recompile your contracts under the hood. That's why you don't need to pass an `artifactsPath`. @@ -32,7 +32,13 @@ Because truffle artifacts don't have all the data we need - we actually will rec ### Other framework/toolset You'll need to write your own artifacts adapter. It should extend `AbstractArtifactsAdapter`. -Look at the code of the two adapters above for examples. + +```typescript +import { AbstractArtifactAdapter } from '@0x/sol-trace'; + +class YourCustomArtifactsAdapter extends AbstractArtifactAdapter {...}; +const artifactAdapter = new YourCustomArtifactsAdapter(...); +``` ### Usage @@ -41,22 +47,20 @@ import { ProfilerSubprovider } from '@0x/sol-profiler'; import ProviderEngine = require('web3-provider-engine'); const provider = new ProviderEngine(); - -const artifactsPath = 'src/artifacts'; -const contractsPath = 'src/contracts'; -const networkId = 50; // Some calls might not have `from` address specified. Nevertheless - transactions need to be submitted from an address with at least some funds. defaultFromAddress is the address that will be used to submit those calls as transactions from. const defaultFromAddress = '0x5409ed021d9299bf6814279a6a1411a7e866a631'; const isVerbose = true; const profilerSubprovider = new ProfilerSubprovider(artifactsAdapter, defaultFromAddress, isVerbose); provider.addProvider(profilerSubprovider); +// Add all your other providers +provider.start(); ``` After your test suite is complete (e.g in the Mocha global `after` hook), you'll need to call: ```typescript -await profilerSubprovider.writeProfilerAsync(); +await profilerSubprovider.writeProfilerOutputAsync(); ``` -This will create a `profiler.json` file in a `profiler` directory. This file has an [Istanbul format](https://github.com/gotwarlost/istanbul/blob/master/profiler.json.md) - so you can use it with any of the existing Istanbul reporters. +This will create a `coverage.json` file in a `coverage` directory. This file has an [Istanbul format](https://github.com/gotwarlost/istanbul/blob/master/profiler.json.md) - so you can use it with any of the existing Istanbul reporters. diff --git a/packages/website/md/docs/sol_trace/installation.md b/packages/website/md/docs/sol_trace/installation.md index 2f794b2f8..eb7bf08b8 100644 --- a/packages/website/md/docs/sol_trace/installation.md +++ b/packages/website/md/docs/sol_trace/installation.md @@ -1,17 +1,17 @@ **Install** ```bash -yarn add @0x/sol-trace +yarn add -D @0x/sol-trace ``` **Import** ```javascript -import { TraceSubprovider } from '@0x/sol-trace'; +import { RevertTraceSubprovider } from '@0x/sol-trace'; ``` or ```javascript -var TraceSubprovider = require('@0x/sol-trace').TraceSubprovider; +var RevertTraceSubprovider = require('@0x/sol-trace').RevertTraceSubprovider; ``` diff --git a/packages/website/md/docs/sol_trace/introduction.md b/packages/website/md/docs/sol_trace/introduction.md index 21fea764e..73f5c2bcd 100644 --- a/packages/website/md/docs/sol_trace/introduction.md +++ b/packages/website/md/docs/sol_trace/introduction.md @@ -1 +1 @@ -Welcome to the [sol-trace](https://github.com/0xProject/0x-monorepo/tree/development/packages/sol-trace) documentation! Sol-trace is a Solidity trace tool for your smart contract tests. +Welcome to the [sol-trace](https://github.com/0xProject/0x-monorepo/tree/development/packages/sol-trace) documentation! Sol-trace gives you a human-readable error stack trace when a revert happens in your Solidity code. diff --git a/packages/website/md/docs/sol_trace/usage.md b/packages/website/md/docs/sol_trace/usage.md index 516585683..e794d0f73 100644 --- a/packages/website/md/docs/sol_trace/usage.md +++ b/packages/website/md/docs/sol_trace/usage.md @@ -1,10 +1,10 @@ -Sol-trace uses transaction traces in order to figure out which lines of Solidity source code have been covered by your tests. In order for it to gather these traces, you must add the `TraceSubprovider` to the [ProviderEngine](https://github.com/MetaMask/provider-engine) instance you use when running your Solidity tests. If you're unfamiliar with ProviderEngine, please read the [Web3 Provider explained](https://0x.org/wiki#Web3-Provider-Explained) wiki article. +Sol-trace uses transaction traces to reconstruct the stack trace when reverts happen in Solidity. In order for it to gather these traces, you must add the `RevertTraceSubprovider` to the [ProviderEngine](https://github.com/MetaMask/provider-engine) instance you use when running your Solidity tests. If you're unfamiliar with `ProviderEngine`, please read the [Web3 Provider explained](https://0x.org/wiki#Web3-Provider-Explained) wiki article. -The TraceSubprovider eavesdrops on the `eth_sendTransaction` and `eth_call` RPC calls and collects traces after each call using `debug_traceTransaction`. `eth_call`'s' don't generate traces - so we take a snapshot, re-submit it as a transaction, get the trace and then revert the snapshot. +The `RevertTraceSubprovider` eavesdrops on the `eth_sendTransaction` and `eth_call` RPC calls and collects traces after each call using `debug_traceTransaction`. `eth_call`'s' don't generate traces - so we take a snapshot, re-submit it as a transaction, get the trace and then revert the snapshot. Trace subprovider needs some info about your contracts (`srcMap`, `bytecode`). It gets that info from your project's artifacts. Some frameworks have their own artifact format. Some artifact formats don't actually contain all the neccessary data. -In order to use `TraceSubprovider` with your favorite framework you need to pass an `artifactsAdapter` to it. +In order to use `RevertTraceSubprovider` with your favorite framework you need to pass an `artifactsAdapter` to it. ### Sol-compiler @@ -12,9 +12,8 @@ If you are generating your artifacts with [@0x/sol-compiler](https://0x.org/docs ```typescript import { SolCompilerArtifactsAdapter } from '@0x/sol-trace'; -const artifactsPath = 'src/artifacts'; -const contractsPath = 'src/contracts'; -const artifactsAdapter = new SolCompilerArtifactsAdapter(artifactsPath, contractsPath); +// Both artifactsDir and contractsDir are optional and will be fetched from compiler.json if not passed in +const artifactAdapter = new SolCompilerArtifactAdapter(artifactsDir, contractsDir); ``` ### Truffle @@ -23,8 +22,9 @@ If your project is using [Truffle](https://truffleframework.com/), we've written ```typescript import { TruffleArtifactAdapter } from '@0x/sol-trace'; -const contractsPath = 'src/contracts'; -const artifactAdapter = new TruffleArtifactAdapter(contractsDir); +const projectRoot = '.'; +const solcVersion = '0.5.0'; +const artifactAdapter = new TruffleArtifactAdapter(projectRoot, solcVersion); ``` Because truffle artifacts don't have all the data we need - we actually will recompile your contracts under the hood. That's why you don't need to pass an `artifactsPath`. @@ -32,25 +32,29 @@ Because truffle artifacts don't have all the data we need - we actually will rec ### Other framework/toolset You'll need to write your own artifacts adapter. It should extend `AbstractArtifactsAdapter`. -Look at the code of the two adapters above for examples. + +```typescript +import { AbstractArtifactAdapter } from '@0x/sol-trace'; + +class YourCustomArtifactsAdapter extends AbstractArtifactAdapter {...}; +const artifactAdapter = new YourCustomArtifactsAdapter(...); +``` ### Usage ```typescript -import { TraceSubprovider } from '@0x/sol-trace'; +import { RevertTraceSubprovider } from '@0x/sol-trace'; import ProviderEngine = require('web3-provider-engine'); const provider = new ProviderEngine(); - -const artifactsPath = 'src/artifacts'; -const contractsPath = 'src/contracts'; -const networkId = 50; // Some calls might not have `from` address specified. Nevertheless - transactions need to be submitted from an address with at least some funds. defaultFromAddress is the address that will be used to submit those calls as transactions from. const defaultFromAddress = '0x5409ed021d9299bf6814279a6a1411a7e866a631'; const isVerbose = true; -const traceSubprovider = new TraceSubprovider(artifactsAdapter, defaultFromAddress, isVerbose); +const revertTraceSubprovider = new RevertTraceSubprovider(artifactsAdapter, defaultFromAddress, isVerbose); -provider.addProvider(traceSubprovider); +provider.addProvider(revertTraceSubprovider); +// Add all your other providers +provider.start(); ``` Now when you run your tests, it should print out stack traces when encountering an error. -- cgit v1.2.3 From fe2f97dabd1511918051161c882c57bcc1d41ac2 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 17 Jan 2019 15:58:41 +0100 Subject: Add link to Truffle starter project --- packages/dev-tools-pages/ts/pages/coverage.tsx | 8 ++++++-- packages/dev-tools-pages/ts/pages/profiler.tsx | 8 ++++++-- packages/dev-tools-pages/ts/pages/trace.tsx | 8 ++++++-- 3 files changed, 18 insertions(+), 6 deletions(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/ts/pages/coverage.tsx b/packages/dev-tools-pages/ts/pages/coverage.tsx index dc1f66462..68b55f2a2 100644 --- a/packages/dev-tools-pages/ts/pages/coverage.tsx +++ b/packages/dev-tools-pages/ts/pages/coverage.tsx @@ -110,8 +110,12 @@ const Coverage: React.StatelessComponent<{}> = () => ( and TruffleArtifactAdapter for use with the{' '} Truffle framework - - . You can also write your own and support any artifact format. + {' '} + (Also see our{' '} + + Truffle example project + {' '} + for a complete walk-through). You can also write your own and support any artifact format.

diff --git a/packages/dev-tools-pages/ts/pages/profiler.tsx b/packages/dev-tools-pages/ts/pages/profiler.tsx index 4af0dd851..1292d726c 100644 --- a/packages/dev-tools-pages/ts/pages/profiler.tsx +++ b/packages/dev-tools-pages/ts/pages/profiler.tsx @@ -107,8 +107,12 @@ const Profiler: React.StatelessComponent<{}> = () => ( and TruffleArtifactAdapter for use with the{' '} Truffle framework - - . You can also write your own and support any artifact format. + {' '} + (Also see our{' '} + + Truffle example project + {' '} + for a complete walk-through). You can also write your own and support any artifact format.

diff --git a/packages/dev-tools-pages/ts/pages/trace.tsx b/packages/dev-tools-pages/ts/pages/trace.tsx index abfac45dd..aee779ac8 100644 --- a/packages/dev-tools-pages/ts/pages/trace.tsx +++ b/packages/dev-tools-pages/ts/pages/trace.tsx @@ -77,8 +77,12 @@ const Trace: React.StatelessComponent<{}> = () => ( and TruffleArtifactAdapter for use with the{' '} Truffle framework - - . You can also write your own and support any artifact format. + {' '} + (Also see our{' '} + + Truffle example project + {' '} + for a complete walk-through). You can also write your own and support any artifact format.

-- cgit v1.2.3 From e68c5d5517ce82c771a68fb1852dceb9f05150ea Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 17 Jan 2019 16:24:03 +0100 Subject: Enable "copy" button on all code snippets that should be copy-able --- packages/dev-tools-pages/ts/components/call_to_action.tsx | 2 +- packages/dev-tools-pages/ts/components/code.tsx | 1 - packages/dev-tools-pages/ts/pages/compiler.tsx | 6 +++--- packages/dev-tools-pages/ts/pages/coverage.tsx | 10 +++++----- packages/dev-tools-pages/ts/pages/profiler.tsx | 10 +++++----- packages/dev-tools-pages/ts/pages/trace.tsx | 10 +++++----- 6 files changed, 19 insertions(+), 20 deletions(-) (limited to 'packages') diff --git a/packages/dev-tools-pages/ts/components/call_to_action.tsx b/packages/dev-tools-pages/ts/components/call_to_action.tsx index abb92b9d3..bd255cfe1 100644 --- a/packages/dev-tools-pages/ts/components/call_to_action.tsx +++ b/packages/dev-tools-pages/ts/components/call_to_action.tsx @@ -9,7 +9,7 @@ import { Beta } from './typography'; const CallToAction: React.StatelessComponent = ({ children }) => ( - {({ subtitle, tagline, docLink }: ContextInterface) => ( + {({ docLink }: ContextInterface) => (