Skip to content

Instantly share code, notes, and snippets.

@twalpole
Created June 25, 2019 05:12
Show Gist options
  • Save twalpole/be9ccd5c4dd356a9e3b627040b882a12 to your computer and use it in GitHub Desktop.
Save twalpole/be9ccd5c4dd356a9e3b627040b882a12 to your computer and use it in GitHub Desktop.
Sortable demo test
require 'bundler/inline'
gemfile do
source 'https://rubygems.org'
gem 'selenium-webdriver'
gem 'webdrivers'
gem 'capybara'
gem 'byebug'
gem 'puma'
end
require 'webdrivers'
require "capybara/dsl"
html = DATA.read
app = proc { |env| [200, { "Content-Type" => "text/html" }, [html] ] }
Capybara.register_driver :w3c do |app|
Capybara::Selenium::Driver.new(app, browser: :chrome)
end
sess = Capybara::Session.new(:w3c, app)
sess.visit('/')
sess.assert_no_text /B.*A/m
occasion_li_1 = sess.find('.sortable-list-item:nth-child(1)')
occasion_li_2 = sess.find('.sortable-list-item:nth-child(2)')
occasion_li_2.drag_to(occasion_li_1)
sess.assert_text /B.*A/m
sleep 5
__END__
<!DOCTYPE html>
<html>
<head>
<title>Snippet</title>
<script src="https://sortablejs.github.io/Sortable/Sortable.js" type="text/javascript"></script>
</head>
<body>
<ul class="sortable-list" data-js-hook="sortable-list">
<li class="sortable-list-item clearfix" data-sortable-id="73">
<i class="drag-handle material-icons">drag_handle</i>
<span class="sortable-name">A</span>
</li>
<li class="sortable-list-item clearfix" data-sortable-id="74">
<i class="drag-handle material-icons">drag_handle</i>
<span class="sortable-name">B</span>
</li>
</ul>
<script>
var el = document.querySelector('ul.sortable-list');
var sortable = Sortable.create(el);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment