first commit
This commit is contained in:
212
pres/index.html
Executable file
212
pres/index.html
Executable file
@@ -0,0 +1,212 @@
|
||||
<!doctype html>
|
||||
<html lang="en" style="background:white;">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>FrosCon - All your browsers are belogn to us</title>
|
||||
<meta name="description" content="UI testing stuff">
|
||||
<meta name="author" content="Sebastian Golasch">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<link rel="stylesheet" href="css/reveal.min.css">
|
||||
<link rel="stylesheet" href="css/theme/default.css" id="theme">
|
||||
<!-- For syntax highlighting -->
|
||||
<link rel="stylesheet" href="lib/css/zenburn.css">
|
||||
<link rel="stylesheet" href="font/stylesheet.css">
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: 'Londrina Solid';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Londrina Solid'), local('LondrinaSolid-Regular'), url('font/solid.woff') format('woff');
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'Londrina Solid' !important;
|
||||
color: red !important;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: 'Londrina Solid' !important;
|
||||
color: #4266a2 !important;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-family: 'Londrina Solid' !important;
|
||||
color: #4266a2 !important;
|
||||
}
|
||||
|
||||
.code {
|
||||
font-family: 'Londrina Solid' !important;
|
||||
color: red !important;
|
||||
}
|
||||
|
||||
.variable {
|
||||
color: hsl(88, 36%, 37%);
|
||||
}
|
||||
|
||||
.function {
|
||||
color: #4266a2;
|
||||
}
|
||||
|
||||
.bracket {
|
||||
color:#000;
|
||||
}
|
||||
|
||||
.comment {
|
||||
color:grey;
|
||||
}
|
||||
|
||||
footer {
|
||||
font-family: 'Londrina Solid' !important;
|
||||
color: white;
|
||||
z-index:9999;
|
||||
display: block;
|
||||
position:absolute;
|
||||
bottom: 0;
|
||||
right: 30px;
|
||||
height: 100px;
|
||||
background: #4266a2;
|
||||
font-size: 30px;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
img {
|
||||
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body style="background:white;">
|
||||
<div class="reveal" style="background:white;">
|
||||
<!-- Any section element inside of this container is displayed as a slide -->
|
||||
<div class="slides" style="background:white;">
|
||||
|
||||
<section>
|
||||
<h1>FrosCon 2014</h1>
|
||||
<h2>All your Browsers are belong to us</h2>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 style="color: red !important">Sebastian Golasch</h2>
|
||||
<h2>DalekJS</h2>
|
||||
<h2>Nightlybuild.io</h2>
|
||||
<h2>Deutsche Telekom P&I</h2>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<img style="border: none; box-shadow: none" src="img/qivicon.png">
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h1>What the heck is Webdriver</h1>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>WebDriver is a W3C editors draft for writing automated tests of websites.</h3>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<img style="border: none; box-shadow: none;" src="img/Webdriver.png"/>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>It aims to mimic the behaviour of a real user, and as such interacts with the HTML of the application.</h3>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h1>Lets us control the browser from outside</h1>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>All implementations of WebDriver that communicate with the browser use the JSON WireProtocol.</h3>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<img style="border: none; box-shadow: none;" src="img/JsonWireProtocol - selenium - A description of the protocol used by WebDriver to communicate with remote instances - Browser automation framework - Google Project Hosting.png"/>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>This wire protocol defines a RESTful web service using JSON over HTTP.</h3>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h1>Turns your Browser into a REST Webserver</h1>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h1>All you need to know is HTTP</h1>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h1>Anything that understands HTTP has access</h1>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>This wire protocol defines a RESTful web service using JSON over HTTP.</h3>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h1>Code Code Code!</h1>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h1>Browser Support</h1>
|
||||
</section>
|
||||
|
||||
<section style="text-align: left; top: -377.5px; display: block;" class="present">
|
||||
<h1 style="font-size: 240% !important"><img src="img/lemmling_ghost.png" style="position: relative; top: 25px; border: none; box-shadow: none"> PhantomJS</h1>
|
||||
<h1 style="font-size: 240% !important"><img src="img/chrome.png" style="position: relative; top: 25px; border: none; box-shadow: none"> Chrome</h1>
|
||||
<h1 style="font-size: 240% !important"><img src="img/explorer.png" style="position: relative; top: 25px; border: none; box-shadow: none"> Internet Explorer</h1>
|
||||
<h1 style="font-size: 240% !important"><img src="img/ipad.png" style="position: relative; top: 25px; border: none; box-shadow: none"> Mobile Safari & Chrome</h1>
|
||||
<h1 style="font-size: 240% !important"><img src="img/firefox.png" style="position: relative; top: 25px; border: none; box-shadow: none"> Firefox (OS)</h1>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h1>Multibrowser example</h1>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h1>Implementing protocols is FUN</h1>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h1>Thank you!</h1>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<img src="img/twitter_bird.svg" style="border: none; box-shadow: none; width: 50% !important;position: relative; top: 0; left: 0;"/>
|
||||
<img src="img/github.svg" style="border: none; box-shadow: none; width: 50% !important; position: relative; top: -70px; left: 60px;"/>
|
||||
<p style="position: relative; top: -110px; left: 0px;">@asciidisco</p>
|
||||
</footer>
|
||||
|
||||
<script src="lib/js/head.min.js"></script>
|
||||
<script src="js/reveal.min.js"></script>
|
||||
<script>
|
||||
// Full list of configuration options available here:
|
||||
// https://github.com/hakimel/reveal.js#configuration
|
||||
Reveal.initialize({
|
||||
controls: false,
|
||||
progress: false,
|
||||
history: true,
|
||||
center: true,
|
||||
|
||||
// The "normal" size of the presentation, aspect ratio will be preserved
|
||||
// when the presentation is scaled to fit different resolutions. Can be
|
||||
// specified using percentage units.
|
||||
width: 1024,
|
||||
height: 768,
|
||||
margin: 0,
|
||||
transition: 'fade', // default/cube/page/concave/zoom/linear/fade/none
|
||||
// Optional libraries used to extend on reveal.js
|
||||
dependencies: [
|
||||
{ src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } }
|
||||
]
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user