我正在努力升级我的 Rails 应用程序以使用 Turbolinks 5 来利用本机包装器。我已经更新了所有的 javascript,并且浏览器和 Android 应用程序中的一切都按预期工作。当我使用 js true 时,我的一些水豚测试遇到了问题。在撰写本文时,我正在使用最新的 capybara (2.11.0)、poltergeist (1.12.0) 和 phantomjs (2.1)。我也尝试过 capybara-webkit 驱动程序,但没有成功。
我似乎遇到问题的是,在 Turbolinks 5 中,所有表单都应远程提交,并且 Turbolinks 知道如何处理请求。我发现使用 Capbara,我的表单在提交后不会重定向,它会保留在同一页面上。我已经做了很多谷歌搜索和反复试验,但还是有一些不足。任何帮助将不胜感激。如果需要更多信息,请告诉我。
scenario 'user has dispatch permission and valid attributes', js: true do
sign_in('jdoe')
page.visit path
page.fill_in 'contact_text_input', with: 'Jimmy'
page.select 'Medium - 3 Hours', from: 'Priority'
page.fill_in 'Created By', with: 'John Doe'
page.click_button 'Create This'
save_and_open_page
expect(page.current_path).to eq("/dispatch")
expect(page).to have_content('This was created successfully')
end
def sign_in(username)
page.visit '/'
page.fill_in 'Username', with: username
page.fill_in 'Password', …Run Code Online (Sandbox Code Playgroud) javascript ruby-on-rails capybara turbolinks ruby-on-rails-4
我已经正确连接了 hotwire/turbo,以便对页面上某个位置的单个模型进行增删改查操作,但我也想同时在页面上的不同位置更新同一模型。我以为我可以设置两个流,但它似乎不起作用。
指定目标确实适用于创建操作,具体取决于我如何命名目标,但不适用于更新和销毁。这是我认为应该有效但无效的:
----位置 1(“生物”流)----
<div id="creatures">
<%= turbo_stream_from "creatures" %>
<%= turbo_frame_tag "creatures" do %>
<div>
<% @creatures.each do |creature| %>
<div>
<%= render "creatures/creature", creature: creature %>
</div>
<% end %>
</div>
<% end %>
</div>
Run Code Online (Sandbox Code Playgroud)
----位置 2(“creatures_main”流)----
<%= turbo_stream_from "creatures_main" %>
<%= turbo_frame_tag "creatures_main" do %>
<% @creatures.each do |creature| %>
<div>
<%= render "creatures/creature", creature: creature %>
</div>
<% end %>
<% end %>
Run Code Online (Sandbox Code Playgroud)
---- 常见_creature.html.erb 部分 ----
<%= turbo_frame_tag dom_id(creature) do %>
<%= link_to creature.name, …Run Code Online (Sandbox Code Playgroud) 我有一个 Rails 6 项目。当使用 Turbolink 加载页面时,turbolinks:load事件会在 <head> 脚本合并并执行之前触发。这些脚本中的事件监听器永远不会被执行,因为它们是在事件发生后添加的。
例如,布局的 <head> 部分包含以下内容的页面:
= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload', defer: 'defer'
= yield :extra_head
Run Code Online (Sandbox Code Playgroud)
页面顶部是这样的:
- content_for :extra_head do
= javascript_pack_tag 'club_edit'
Run Code Online (Sandbox Code Playgroud)
生成这个 html:
<script src="/packs/js/application-629a480faedfc40e8948.js" data-turbolinks-track="reload" defer="defer"></script>
<script src="/packs/js/club_edit-8d7d256609de3b852df1.js"></script>
Run Code Online (Sandbox Code Playgroud)
club_edit.js 文件添加一个侦听器来turbolinks:load调用名为init()
document.addEventListener('turbolinks:load', init);
Run Code Online (Sandbox Code Playgroud)
当我“正常”加载页面时,它会按预期工作并且该init()函数会被调用。但是,如果我从 Turbolinks 链接加载它,它会执行 xhr 调用,并turbolinks:load在添加侦听器之前触发事件。
我应该做什么来确保init()函数以任何一种方式被调用?
我很难尝试将javascript Facebook SDK加载到我的rails 4应用程序中.有没有一种方法可以让它与turbolinks一起正常工作?
如果我在我的JS应用程序资产上添加此代码.由于turbolinks,它无法正常工作:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : 'YOUR_APP_ID', // App ID from the app dashboard
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel file for x-domain comms
status : true, // Check Facebook Login status
xfbml : true // Look for social plugins on the page
});
// Additional initialization code such as adding Event Listeners goes here
};
// Load the SDK asynchronously
(function(d, s, id){
var js, …Run Code Online (Sandbox Code Playgroud) 我的页面上有一个非常简单的链接.<a href="#">My link</a>.它会导致页面刷新.当我删除"turbolinks"时,它不再导致刷新.
我过去一直使用带有哈希片段的链接.除非我长时间遗漏了一些非常基本的东西,否则我不明白这是如何导致刷新的.
它没有附加任何JS事件处理程序.
有任何想法吗?
这可能没关系,但我正在使用jQuery,Twitter-Bootstrap和Ruby on Rails.
到目前为止的线索:
我试图在我的Rails网站上设置AddThis插件,但目前只取得了部分成功.问题是它不能像turbo-links一样工作.AddThis共享按钮仅在页面刷新后出现.如果我点击网站的其他部分,AddThis工具栏将消失.如果我禁用turbo-links,那么它将适用于网站的每个部分.
这是我生成智能图层时的代码:
<!-- AddThis Smart Layers BEGIN -->
<!-- Go to http://www.addthis.com/get/smart-layers to customize -->
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=xxx"></script>
<script type="text/javascript">
addthis.layers({
'theme' : 'transparent',
'share' : {
'position' : 'left',
'numPreferredServices' : 5
}
});
</script>
<!-- AddThis Smart Layers END -->
Run Code Online (Sandbox Code Playgroud)
该代码当然不适用于turbo-links.我发现这个解决方案' 如何使用turbilinks rails 4添加这项工作,作者证实它有效,但当我点击网站的其他部分时我仍然有问题.
我试图head在我的application.html.erb文件中的标记内插入此代码:
<!-- AddThis Smart Layers BEGIN -->
<!-- Go to http://www.addthis.com/get/smart-layers to customize -->
<script type="text/javascript">$(document).ready(function() {
var script="//s7.addthis.com/js/300/addthis_widget.js#pubid=xxx";
if (window.addthis){
window.addthis = null;
window._adr = null; …Run Code Online (Sandbox Code Playgroud) 我有一个带有2个按钮的标题:登录和注册就像这样.当我点击其中一个时,会出现一个窗口:窗口打开.为此,我用粉底的"显示模态"(显示模态).
我的问题:如果我点击链接打开我的网站的新页面并尝试打开/关闭登录或注册弹出窗口,窗口关闭,但这次阴影保持(像这样),我需要按F5这又有效了.
我使用Rails 4和基础5.
文件_header.html.erb(查看部分)
<div class="large-12 columns header">
<div class="logo">
logo
</div>
<div class="infos">
<ul>
<li><a href="#" class="" data-reveal-id="login">Login</a></li>
<li><a href="#" class="" data-reveal-id="signup">Sign up</a></li>
</ul>
</div>
</div>
<div id="login" class="reveal-modal" data-reveal>
<p>
Page Test
</p>
</div>
<div id="signup" class="reveal-modal roundish" data-reveal>
<p>
Page Test
</p>
</div>
Run Code Online (Sandbox Code Playgroud)
文件application.js
//= require jquery
//= require turbolinks
//= require foundation
//= require bxslider/jquery.bxslider.min.js
//= require home
//= require_tree .
$(function() {
$(document).foundation();
});
Run Code Online (Sandbox Code Playgroud)
谢谢您的帮助.
我最近使用Rails 4.2.0创建了一个新项目,并创建了一个名为Land登录页面的控制器.所以,我在visting时遇到了这个错误http://localhost:3000/land/home:
Started GET "/" for ::1 at 2015-02-27 15:56:23 -0600
Processing by LandController#home as HTML
Rendered land/home.html.erb within layouts/application (0.0ms)
Completed 500 Internal Server Error in 5526ms
ActionView::Template::Error (TypeError: Object doesn't support this property or method
(in C:/Ruby21-x64/lib/ruby/gems/2.1.0/gems/turbolinks-2.5.3/lib/assets/javascripts/turbolinks.js.coffee)):
3: <head>
4: <title>Course</title>
5: <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
6: <%= javascript_include_tag 'application' %>
7: <%= csrf_meta_tags %>
8: </head>
9: <body>
app/views/layouts/application.html.erb:6:in `_app_views_layouts_application_html_erb__1279127835_98590860'
Rendered C:/Ruby21-x64/lib/ruby/gems/2.1.0/gems/web-console-2.0.0/lib/action_dispatch/templates/rescues/_source.erb (5.0ms)
Rendered C:/Ruby21-x64/lib/ruby/gems/2.1.0/gems/web-console-2.0.0/lib/action_dispatch/templates/rescues/_trace.html.erb (10.0ms)
Rendered C:/Ruby21-x64/lib/ruby/gems/2.1.0/gems/web-console-2.0.0/lib/action_dispatch/templates/rescues/_request_and_response.html.erb …Run Code Online (Sandbox Code Playgroud) 我遇到的问题是,当我浏览表单页面并单击文本字段上的date_sent时,jQuery应该弹出一个datepicker.但是,我一开始什么都没得到,但是当我刷新页面时它就可以了.
我几乎可以肯定我的问题是使用turbolinks,因为我认为我的JavaScript因为turbolinks而没有加载.但是,我不想删除turbolinks,因为没有它我的页面渲染速度很慢.我怎样才能做到这一点?
的application.js
//= require jquery
//= require jquery-ui/datepicker
//= require jquery_ujs
//= require bootstrap-sprockets
//= require cocoon
//= require turbolinks
//= require_tree .
Run Code Online (Sandbox Code Playgroud)
application.scss
*= require_self
*= require jquery-ui/datepicker
*= require_tree .
*/
@import 'bootstrap-sprockets';
@import 'bootstrap';
@import 'sites';
Run Code Online (Sandbox Code Playgroud)
form.coffee
jQuery ->
$('#send_date').datepicker()
Run Code Online (Sandbox Code Playgroud)
form.html.erb
<div class="form-group" >
<%= f.label :date_sent, class: 'control-label' %><br>
<%= f.text_field :date_sent, id: 'send_date' %>
</div>
Run Code Online (Sandbox Code Playgroud) 根据Turbolinks 5文档中的“跟随重定向”(https://github.com/turbolinks/turbolinks#following-redirects):
当您访问location
/one并且服务器将您重定向到location时/two,您希望浏览器的地址栏显示重定向的URL。但是,Turbolinks使用发出请求
XMLHttpRequest,该请求透明地跟随重定向。Turbolinks无法在没有服务器额外配合的情况下判断请求是否导致了重定向。
解决方案是:
发送
Turbolinks-Location标头以响应被重定向的访问,Turbolinks将用您提供的值替换浏览器的最高历史记录条目。Turbolinks Rails引擎针对通过
redirect_to助手重定向的非GET XHR请求自动执行此优化。
我对在Django(1.11)项目上使用Turbolinks感兴趣,我想知道是否有人可以向我指出如何创建新的Django redirect()函数或修改现有函数以始终包含Turbolinks的正确方向-重定向到预期功能所需的位置标头。我绝对不希望每次重定向时都手动设置此标头。
在“提交表单后重定向”部分中有一个类似的条目(https://github.com/turbolinks/turbolinks#redirecting-after-a-form-submission),对于理解如何实现的任何帮助,我也将不胜感激:
如果表单提交导致服务器上的状态更改影响缓存的页面,请考虑使用清除Turbolinks的缓存
Turbolinks.clearCache()。Turbolinks Rails引擎针对通过
redirect_to助手重定向的非GET XHR请求自动执行此优化。
我确实在github上看到一个“为Django引入Turbolinks实现”程序包,但这是从turbolinks-classic派生的,并且源代码没有提及Turbolinks-Location标头,因此我确定这不是我想要的。
turbolinks ×10
javascript ×4
jquery ×2
addthis ×1
capybara ×1
coffeescript ×1
django ×1
facebook ×1
http-headers ×1
python ×1
redirect ×1
rubygems ×1
ujs ×1