检查项目是否在超规格中"clickable"

Question

我有一个像这样的Hyperstack组件：

      render do
        LI(class: class_names, title: conflicts || '',
           data: { toggle: :tooltip, placement: 'auto left', container: :body }) do
          DIV(class: 'row paper-row') do
            DIV(class: 'col-sm-12 text-left') do
              P(class: 'medium-weight', id: 'tp_envelopes') { params.envelope.name }
            end
          end
        end.on(:click) { select_envelope }
      end

如果 conflicts 方法返回非 nil 值，我希望 on(：click( 处理程序是有条件的。

我也想知道如何在超规格/卡佩巴拉中测试它......即如何检查 HTML 元素是否响应 ：click 事件？

Answer 1

您可以使用以下

方法有条件地关闭/打开单击处理程序

end.tap { |item| item.on(:click) { select_envelope } unless conflicts }

要替换

end.on(:click) { select_envelope }

Answer 2

end.on(:click) { select_envelope }

您可以替换(:click)跟：

(!conflicts && :click)

这是有效的，因为如果冲突不是 nil，这将导致 nil 单击处理程序不执行任何操作。

Answer 3

由于事件冒泡，我不确定检查元素中的单击事件是否可靠。

我会编写测试来单击元素，然后期望单击事件中的任何逻辑都不会发生。

conflicts = true
element.click() # trigger select_envelope
expect(selected_envelope).to be_nil # no envelope should be selected due to conflicts

Answer 4

保持代码干净的一个好方法是在事件中调用的方法中返回：

def select_envelope
  return if conflicts
  ...
end
# this keeps the event handler the same
end.on(:click) { select_envelope }

由于必须始终触发事件，性能影响可以忽略不计，但始终存在性能与可读性的争论。