foundation / foundation-sites

The most advanced responsive front-end framework in the world. Quickly create prototypes and production code for sites that work on any kind of device.
https://get.foundation
MIT License
29.65k stars 5.5k forks source link

Javascript Errors being thrown out in Safari #9409

Closed lspoor closed 6 years ago

lspoor commented 7 years ago

So I'm getting the following errors:

screen shot 2016-11-25 at 19 23 04

This is only appearing in Safari 9 on my Mac. It appears to be caused by all the foundation files. Has anybody else come across this?

Deckluhm commented 7 years ago

Can you provide more info? When is it happening?

A CodePen reproducing the issue would be really helpful.

lspoor commented 7 years ago

Apologies. You can view it on this site - http://exoticzoo.lspoor.co.uk

Sent from my iPhone

On 26 Nov 2016, at 00:10, Arnaud Thomas Desessarts notifications@github.com wrote:

Can you provide more info? When is it happening?

A CodePen reproducing the issue would be really helpful.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or mute the thread.

DaSchTour commented 7 years ago

After a short look on your app.js it looks like something with your line breaks is messed up because the file is full of /n I guess it's more a problem of the tool you use to create the app.js or the way you serve it.

lspoor commented 7 years ago

Here's my gulpfile that compiles everything, is there any issues here?

/*
 |--------------------------------------------------------------------------
 | Elixir Asset Management
 |--------------------------------------------------------------------------
 |
 | Elixir provides a clean, fluent API for defining some basic Gulp tasks
 | for your Laravel application. By default, we are compiling the Sass
 | file for our application, as well as publishing vendor resources.
 |
 */

const elixir = require('laravel-elixir');

elixir.config.publicDir = 'html';
elixir.config.publicPath = 'html';

elixir(function(mix) {
      mix
      .copy(
            './node_modules/foundation-sites/scss', 
            'resources/assets/scss/foundation'
      )

      .copy(
            './node_modules/foundation-sites/js',
            'resources/assets/js/foundation'
      )

      .copy(
            './resources/assets/images',
            'html/images'
      )

      .copy(
            './resources/assets/fonts',
            'html/fonts'
      )

      .copy(
            './resources/assets/js/api',
            'html/js/api'
      )

      .copy(
            './resources/assets/js/libraries',
            'html/js'
      )

      .sass(
            './resources/assets/scss/app.scss', 
            'html/css/style.css'
      )

      .webpack([
            /// Jquery
            './node_modules/jquery/src/jquery.js',

            /// Vue components
            //'vue.js',

            /// Foundation 6 core
            'foundation/foundation.core.js',

            /// Foundation 6 components
            'foundation/foundation.abide.js',
            'foundation/foundation.accordion.js',
            'foundation/foundation.accordionMenu.js',
            'foundation/foundation.drilldown.js',
            'foundation/foundation.dropdown.js',
            'foundation/foundation.dropdownMenu.js',
            'foundation/foundation.equalizer.js',
            'foundation/foundation.interchange.js',
            'foundation/foundation.magellan.js',
            'foundation/foundation.offcanvas.js',
            'foundation/foundation.orbit.js',
            'foundation/foundation.responsiveMenu.js',
            'foundation/foundation.responsiveToggle.js',
            'foundation/foundation.reveal.js',
            'foundation/foundation.slider.js',
            'foundation/foundation.sticky.js',
            'foundation/foundation.tabs.js',
            'foundation/foundation.toggler.js',
            'foundation/foundation.tooltip.js',
            'foundation/foundation.util.box.js',
            'foundation/foundation.util.keyboard.js',
            'foundation/foundation.util.mediaQuery.js',
            'foundation/foundation.util.motion.js',
            'foundation/foundation.util.nest.js',
            'foundation/foundation.util.timerAndImageLoader.js',
            'foundation/foundation.util.touch.js',
            'foundation/foundation.util.triggers.js',

            // Custom Code
            'app.js'

      /// Combine in html/js/app.js
      ], 
            'html/js/app.js'
      )

      .version([
            'css/style.css',
            'js/app.js'
      ]);
});
kball commented 7 years ago

I'm looking into this and definitely somewhat confused... so it looks like webpack is putting everything together and evaling them... but when I copy out that eval into safari it works fine for me... I would definitely lean towards it being a webpack config issue but I'm not knowledgeable enough about webpack to tell you what it is. @mrsweaters you're a webpack guru now, can you help out?

lspoor commented 7 years ago

Any ideas why the errors are only showing in specific browsers too? Let me know if you need to view anything else from my project code!

colin-marshall commented 6 years ago

@lspoor is this still an issue?

lspoor commented 6 years ago

No idea tbh, I use the CLI whenever I'm using Sites now and don't recall any issues with the current version(s)

colin-marshall commented 6 years ago

Thanks for responding!