小编Jan*_*nis的帖子

我刚刚开始使用Jest测试框架,虽然直接单元测试工作正常,但我在测试其模块中的任何组件(通过babel + webpack的ES模块)需要HTML文件时遇到大量问题.

这是一个例子:

import './errorHandler.scss';
import template from './errorHandler.tmpl';

class ErrorHandler {
    ...

我正在加载我在Jest的package.json配置中设置的组件特定SCSS文件以返回一个空对象但是当Jest尝试运行该import template from './errorHandler.tmpl';行时它会断开说:

/Users/jannis/Sites/my-app/src/scripts/errorHandler/errorHandler.tmpl.html:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){<div class="overlay--top">
                                                                                         ^
    SyntaxError: Unexpected token <

        at transformAndBuildScript (node_modules/jest-runtime/build/transform.js:284:10)

我的Jest配置package.json如下:

"jest": {
    "setupTestFrameworkScriptFile": "<rootDir>/test/setupFile.js",
    "moduleDirectories": ["node_modules"],
    "moduleFileExtensions": ["js", "json", "html", "scss"],
    "moduleNameMapper": {
        "^.+\\.scss$": "<rootDir>/test/styleMock.js"
    }
}

似乎webpack html-loader与Jest无法正常工作,但我找不到任何有关如何解决此问题的解决方案.

有谁知道如何html-loader import在我的测试中使这些工作？他们加载我的lodash模板标记,我宁愿不在我的.js文件中有这些大量的HTML块,所以我可以省略该import template from x部分.

PS:这不是一个反应项目,只是简单的webpack,babel,es6.

我基本上循环了一堆youtube视频网址来获取每个视频的id代码.

然后我重复列表中的所有"缩略图"图像,并用youtube视频缩略图网址替换源代码.

我目前遇到的问题是,如果视频已从youtube中删除,则生成的图像源将不会返回正常运行的图像URL,但是替换仍然会触发,因此将损坏的图像URL放入列表中.

在使用缩略图源替换初始图像源之前,如何让jQuery检测网址是否仍然有效？

这是我的代码循环遍历页面上的youtube剪辑并过滤其ID:

function generateYoutubeThumbnails() {
    var YTT = {};
    YTT.videos = $('.video-thumbnail'); // the placeholder thumbnail image

    YTT.videos.each(function(i) {
        YTT.url = $(this).attr('data-videourl'); // the youtube full url, eg: http://www.youtube.com/watch?v=F52dx9Z0L5k
        YTT.videoId = YTT.url.replace(/(.+?)watch\?v=/gi,'').replace(/\&(.+)$/gi,''); // find and replace to get just the id: eg: F52dx9Z0L5k

        YTT.snip = 'http://img.youtube.com/vi/'+ YTT.videoId +'/hqdefault.jpg'; // the thumbnail url which would return: http://img.youtube.com/vi/F52dx9Z0L5k/hqdefault.jpg in this case.

        $(this).attr('src', YTT.snip); // replace the placeholder thumbnail with the proper youtube thumbnail that we got above …

我正在做一个简单的Lookbehind断言来获取URL的一部分(下面的示例)但是没有得到匹配,我得到以下错误:

Uncaught SyntaxError: Invalid regular expression: /(?<=\#\!\/)([^\/]+)/: Invalid group

这是我正在运行的脚本:

var url = window.location.toString();

url == http://my.domain.com/index.php/#!/write-stuff/something-else

// lookbehind to only match the segment after the hash-bang.

var regex = /(?<=\#\!\/)([^\/]+)/i; 
console.log('test this url: ', url, 'we found this match: ', url.match( regex ) );

结果应该是write-stuff.

任何人都可以解释为什么这个正则表达式组导致此错误？对我来说看起来像一个有效的RegEx.

我知道如何获得我需要的细分市场的替代方案,所以这只是帮助我了解这里发生的事情,而不是获得替代解决方案.

谢谢阅读.

J.

我是Ruby和Rails的新手,但即使在搜索堆栈溢出和谷歌后我也找不到答案.

我有一个简单的Ruby简写if语句应该返回integer如下:

# in the context of this erb document `amount` is defined as 5.
@c = ( defined? amount ? amount : r( 1,4 ) )

r()是一个自定义辅助函数,在这种情况下返回1和4 之间的随机数.

我打算这样工作的方式if amount是定义,然后使用定义为的数字amount,else生成1到4之间的随机数,然后使用它.

@c然而,当打印出Ruby输出expression而不是数字时.

我需要做些什么才能让我按照我的意图工作,我做错了什么？

非常感谢您的阅读!

我使用了优秀的gskinner.com/RegExr/工具来测试我的字符串匹配正则表达式,但我无法弄清楚如何将这个实现到我的JavaScript文件中以返回true或false.

我的代码如下:

^(http:)\/\/(.+\.)?(stackoverflow)\.

在这样的网址上http://stackoverflow.com/questions/ask会匹配(根据RegExr)http://stackoverflow.

所以这很好,因为我想尝试将当前匹配window.location到该字符串,但我遇到的问题是这个JavaScript脚本不起作用:

var url = window.location;
if ( url.match( /^(http:)\/\/(.+\.)?(stackoverflow)\./ ) ) 
{
    alert('this works');
};

我在这里做错了什么想法？

谢谢阅读.

Jannis

我有一个简单的问题,我似乎无法找到解决方案.

基本上在这个网站上:http://dev.supply.net.nz/vendorapp/(目前正在开发中)我有一些花哨的label动画在focus&上滑动blur.

但是,一旦用户登录,浏览器很可能会记住与用户电子邮件地址/登录相关联的密码.(哪个好,不应该被禁用.)

但是label,当浏览器#password自动设置字段上的值时,我会遇到触发滑出动画的问题,因为事件的结果既不是也不focus是blur.

当浏览器"自动填充"用户密码时,是否有人知道使用哪个监听器来运行我的功能？

以下是该问题的快速屏幕截图:

密码自动填充标签问题http://dl.dropbox.com/u/376243/fill_issue.png

我想这应该是一个非常简单的任务,但使用Firefox for Mac,3.6.12以下不起作用:

// assign data attributes
$('.gallery li').each(function(i) {
    $(this).data('slide',i+1);
});

// outputting an empty jQuery object
console.log($('.gallery li[data-slide]'));

// this does not work either outputting an empty jQuery object
console.log($("[data-slide]"));

使用Firebug我可以看到所有数据幻灯片属性(包括它们的数值)都正确附加到lis并注销:

$('.gallery li').each(function(index) {
  console.log($(this).data());
});

按预期输出:

Object { slide=1}
Object { slide=2}
Object { slide=3}
Object { slide=4}

那为什么第一个console.log不起作用呢？

我正在返回一些数据(下面的示例)并将其保存到jQuery对象(或者这是一个数组,我让两者混淆？)当我记录变量时,它具有我正在寻找的值的对象但是如何做我访问这个对象里面的数据？

码

$itemPosition = {
    'top': $item.offset().top,
    'left':$item.offset().left
},

console.log($itemPosition);

这将退出(在这种情况下预期) top: 0&left: 490.

但我怎么知道这些价值观的工作呢？

此外,虽然这可能很明显我仍处于学习jQuery/Javascript的早期阶段,但请放心,参考书已经开始了,但到目前为止,SO社区对我的学习非常宝贵,所以感谢阅读!

J.

我写了一个非常简单的'部署'脚本作为我的post-update钩子在我的裸git仓库中运行.

变量如下

live domain         = ~/mydomain.com
staging domain      = ~/stage.mydomain.com
git repo location   = ~/git.mydomain.com/thisrepo.git (bare)

core                = ~/git.mydomain.com/thisrepo.git
core                == added remote into each live & stage gits

既live与stage已经初始化的git回购(非裸)和我已经加入我的裸回购作为远程他们每个人(命名core),这样git pull core stage或git pull core live会从各自的拉动更新的文件branch中的core回购.

脚本如下:

#!/usr/bin/env ruby

# Loop over each passed in argument
ARGV.each do |branch|

  # If it matches the stage then 'update' the staging files
  if branch == "refs/heads/stage" …

我有一个carousel指令,其中包含一些块,用于将传入的数组映射items到元素结构数组的数组中,然后生成类似于以下伪代码的标记:

<array of arrays>

  <array of items>
    <item>
    <item>
  </array of items>

  <array of items>
    <item>
    <item>
  </array of items>

</array of arrays>

这个角度模板如下所示:

<div class="carousel__content" ng-style="carousel.containerWidth">
  <ul class="carousel__chunk" ng-repeat="chunk in carousel.chunks" ng-style="carousel.chunkWidth">
    <li class="carousel__item" ng-repeat="item in chunk" ng-style="carousel.itemWidth">
      <div class="carousel__item-content">

        [element should be transcluded into this spot.]

      </div>
    </li>
  </ul>
</div>

鉴于我的观看代码:

<!-- The <a> tag should appear inside the 'carousel.html' template's ng-repeat list. -->
<carousel items="items" config="config">
  <a href="#">{{ item.name }}</a>
</carousel>

我希望transcluded元素绑定到item最深的对象ng-repeat …